https://github.com/br0ken-/prototyping-tool
Do "npm install" and start prototyping.
https://github.com/br0ken-/prototyping-tool
babel eslint gulp php postcss prototype-kit scss stylelint webpack
Last synced: about 1 month ago
JSON representation
Do "npm install" and start prototyping.
- Host: GitHub
- URL: https://github.com/br0ken-/prototyping-tool
- Owner: BR0kEN-
- Created: 2016-07-20T04:28:51.000Z (almost 9 years ago)
- Default Branch: webpack
- Last Pushed: 2018-05-19T21:53:49.000Z (almost 7 years ago)
- Last Synced: 2025-02-04T00:34:00.910Z (3 months ago)
- Topics: babel, eslint, gulp, php, postcss, prototype-kit, scss, stylelint, webpack
- Language: JavaScript
- Homepage:
- Size: 135 KB
- Stars: 3
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Prototyping Tool
## Installation
```bash
npm install
```
## Features
- ES6 syntax today: let [Webpack](https://github.com/webpack/webpack) do a dirty job.
- Live reload: track changes in SCSS, JS and PHP files.
- [PostCSS](https://github.com/postcss/postcss) and [Autoprefixer](https://github.com/postcss/autoprefixer): write only clean CSS.
- Quality: SCSS & JavaScript code sniffers ([ESLint](https://github.com/eslint/eslint) and [StyleLint](https://github.com/stylelint/stylelint)).
- Configurability: [Babel](.babelrc), [Bower](.bowerrc), [BrowsersList](.browserslistrc), [ESLint](.eslintrc), [PostCSS](.postcssrc) and [StyleLint](.stylelintrc) configs are open to you.
## Tasks
- `npm start` - starts a built-in PHP web-server that tracks changes of all sources.
- `npm run build` - compiles the code in production-ready mode.
## Requirements
- PHP >= 5.4
- NPM >= 4
- Node.js
## Notes
- Why my resulting JS is about 500 Kb when `main.js` is empty?
The file is not exactly empty - it has `import 'babel-polyfill'` for adding all missing ES6 features. Running `npm start` your application starts in `development` mode when JS is not compressed. If you run `npm run build` that compiles production-ready code the total size will be around 100 Kb. You also may consider removing `import 'babel-polyfill'` to have compiled file empty, but missing (in various browsers) ES6 features will no longer be available.
- Where and how the development server starts?
To up the server and allow you to code we're using [PHP's built-in web-server](http://php.net/manual/en/features.commandline.webserver.php) that is available from 5.4. It'll be serving an application at http://127.0.0.1:9011 but you may change this in [config.json](config.json). Nobody requires you to code in PHP, you can just simply add a plain HTML in [dist/index.php](dist/index.php) and do your app only using JavaScript and/or SCSS.