codesandcoffees/vuejs-landing-page

This is a Vue.js version of the template Boxer - Software Landing Page

Boxer - Software Landing Page (Vue.js)

This is a Vue.js boilerplate for the template Boxer - Software Landing Page created by ThemeWagon.

Assets

The assets used are directly from the template itself and is not local. PRs for this are highly welcome. When hosting this from gh-pages make sure to click the unblock pop-up to allow external assets to be loaded.

Temporary fix for the external js files being blocked is to use github to host the js files. Replace the codes in the index.html. The url goes like

https://rawgit.com/<username>/<repository>/<file_path>.js

Deploying (26-February-2017)

Add a homepage field in the package.json to where to serve the app from. This will be added to the index.html

Example "homepage": "https://username.github.io/repo/" will become https://username.github.io/repo/style.css in the index.html.

Commands (26-February-2017)

• yarn start will run a locally served app
• yarn build will build the app locally
• yarn deploy will build the app and deploy to github pages

Vue.js starter template

A bare-bones starter-template to get your hands dirty with awesome Vue.js library.

Built with:

• Vue.js 2
• Vue Router 2
• Axios
• Animate.css
• Babel
• Bootstrap 4
• BrowserSync
• ESLint
• Font Awesome
• JSONPlaceholder
• SASS
• Webpack 2
• Yarn
• ...and many more

Getting started

1. Be sure you have Yarn installed globally.
2. Clone the repo & run yarn from the project root

Single File Components

See instructions for example usage of single file components.

Available commands

yarn start

Runs the Webpack module-bundler, starts watching for changes & launches the BrowserSync server to http://localhost:3000 (it's possible to change the port from package.json config-section). Uses Webpack Dashboard

Note! Webpack handles all the reloading stuff while BrowserSync just proxies the default webpack-port (8080) giving the possibility to connect to dev-server from multiple devices:

yarn lint:js

Lints javascript-files inside /src directory

yarn validate:dev

Validates Webpack development configuration (useful if you add plugins / loaders)

yarn validate:prod

Validates Webpack production configuration (useful if you add plugins / loaders)

yarn build

Runs the webpack module-bundler with production-settings (compress etc.) and builds the project to /build directory.

Demo

Navigate to https://codesandcoffees.github.io/vuejs-landing-page/ and see the awesomeness IRL