An open API service indexing awesome lists of open source software.

https://github.com/bencodezen/fe-starter-template

Basic template for starting a new front-end project
https://github.com/bencodezen/fe-starter-template

Last synced: about 1 month ago
JSON representation

Basic template for starting a new front-end project

Awesome Lists containing this project

README

          

# BenCodeZen's Front-End Starter Template

Let's face it. There was a time once where all you had to do was write HTML, CSS and JS and that was all there was to having (more or less) production ready code.

Don't get me wrong, I wouldn't trade that for the world when you consider all the cool new toys we get to play with now. But let's be honest with ourselves, getting from point A to point B is a lot harder these days.

Luckily for us, [ParcelJS](https://parceljs.org/) came out recently and I canno tell you how simple it made this idea of mine come to life. So here's a basic front-end template to get you from dev code to production with even less configuration.

_Note: This will be updated as time goes on and I find gaps in this setup and will enhance it as I go!_

## Features

* [Hot Module Replacement (HMR)](https://parceljs.org/hmr.html)!
* [Sass](http://sass-lang.com/) pre-processor already configured!\*
* [PostCSS](http://postcss.org/) with [Autoprefixer](https://github.com/postcss/autoprefixer) ready to go!
* [Babel](https://babeljs.io/) transpiling so you can use shiny new ES6+ syntax!

\* _There is a known issue with Sass HMR at the moment, so if you want want your styles to reload automatically, switch back to CSS. You can track the issue [here](https://github.com/parcel-bundler/parcel/issues/606)._

## Getting Started

1. Clone this repository
2. Navigate to the project in your terminal
3. Run `npm install` or `yarn`
4. Run `npm run dev` or `yarn dev`

## Building Production Assets

1. Run `npm run build`

'Nuff said.