⛵ A blogging client UI built on VueJS
Simple and powerful blogging site, created as VueJS study case with with purpose to be my blog using hapi-blog as core engine.
# clone repo
$ git clone https://github.com/lexmartinez/vue-blog-ui
# change directory to cloned app
$ cd vue-blog-ui
# install the dependencies with npm
$ npm install
# start the server
$ npm run dev
go to http://localhost:8080 in your browser.
What you need to run this app:
node
andnpm
(Use NVM)- Ensure you're running Node (
v7.x.x
+) and NPM (4.x.x
+)
After you have installed all dependencies you can now start developing with:
npm run dev
It will start a local server using webpack
which will watch, build (in-memory), and reload for you. The application can be checked at http://localhost:8080
.
vue-blog-ui
has an ESLint integration for consistent code inspection, you can run that tool with command:
npm test
In order to generate a dist bundle you can use the following commands:
# build for production with minification
npm run build
# build for production and view the bundle analyzer report
npm run build --report
For a detailed explanation on how things work, check out the guide and docs for vue-loader.
This app is ready to be deployed to github pages through TravisCI (using the .travis.yml file) you just need to create the github repo and setup the github key on travisCI
Since if you enter a URL directly the router will throw us a 404 error, we must add the following snippet to our .htaccess
file if we are deploying in apache server, if you can not check the vue docs in order to see other setup / server options
<ifModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /post.php [L]
</ifModule>
Note that we are redirecting the requests to
post.php
in order to use our metatags script/plugin but if you don't want use it or your server isn't PHP compatible you can replace that line (7) byRewriteRule . /index.html [L]
This project is licensed under MIT License - see the LICENSE.md file for details
Special thanks to this (SnipCart article)[https://snipcart.com/blog/vuejs-blog-demo], was a big lighthouse for start this project and it's structure