GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → kozlice → Angular2 Webpack Boilerplate

kozlice / Angular2 Webpack Boilerplate

Licence: mit
A boilerplate for Angular 2 and Webpack

Programming Languages

typescript
32286 projects

Labels

webpackboilerplateangular2coverage

Projects that are alternatives of or similar to Angular2 Webpack Boilerplate

Secure Electron Template
The best way to build Electron apps with security in mind.
Stars: ✭ 623 (+1976.67%)
Mutual labels:  webpack, boilerplate
React Isomorphic Boilerplate
🌟 An universal React isomorphic boilerplate for building server-side render web app.
Stars: ✭ 653 (+2076.67%)
Mutual labels:  webpack, boilerplate
Vue Crud
Vue.js based REST-ful CRUD system
Stars: ✭ 629 (+1996.67%)
Mutual labels:  webpack, boilerplate
Webpack React Redux
A boilerplate for playing around with react, redux and react-router with the help of webpack.
Stars: ✭ 612 (+1940%)
Mutual labels:  webpack, boilerplate
Wp Vuejs
WordPress VueJS Starter Theme
Stars: ✭ 19 (-36.67%)
Mutual labels:  webpack, boilerplate
React App
Create React App with server-side code support
Stars: ✭ 614 (+1946.67%)
Mutual labels:  webpack, boilerplate
Vortigern
A universal boilerplate for building web applications w/ TypeScript, React, Redux, Server Side Rendering and more.
Stars: ✭ 647 (+2056.67%)
Mutual labels:  webpack, boilerplate
Cc
一个基于angular5.0.0+ng-bootstrap1.0.0-beta.8+bootstrap4.0.0-beta.2+scss的后台管理系统界面(没基础的同学请先自学基础，谢谢！)
Stars: ✭ 416 (+1286.67%)
Mutual labels:  webpack, angular2
Marvin
Opinionated React app boilerplate in TypeScript, based on CRA.
Stars: ✭ 783 (+2510%)
Mutual labels:  webpack, boilerplate
Minimal React Webpack Babel Setup
The minimal React, Webpack, Babel Setup. You want to get beyond create-react-app?
Stars: ✭ 777 (+2490%)
Mutual labels:  webpack, boilerplate
Ngx Admin
Customizable admin dashboard template based on Angular 10+
Stars: ✭ 23,286 (+77520%)
Mutual labels:  webpack, angular2
M Fe Boilerplates
Lucid & Futuristic Production Boilerplates For Frontend(Web) Apps, React/RN/Vue, with TypeScript(Optional), Webpack 4/Parcel, MobX/Redux 💫 多技术栈前端项目模板
Stars: ✭ 877 (+2823.33%)
Mutual labels:  webpack, boilerplate
Angular Hmr
🔥 Angular Hot Module Replacement for Hot Module Reloading
Stars: ✭ 490 (+1533.33%)
Mutual labels:  webpack, angular2
Express Babel
Express starter kit with ES2017+ support, testing, linting, and code coverage
Stars: ✭ 621 (+1970%)
Mutual labels:  boilerplate, coverage
React Starter Kit
React Starter Kit — front-end starter kit using React, Relay, GraphQL, and JAM stack architecture
Stars: ✭ 21,060 (+70100%)
Mutual labels:  webpack, boilerplate
React Webpack Typescript Starter
Minimal starter with hot module replacement (HMR) for rapid development.
Stars: ✭ 632 (+2006.67%)
Mutual labels:  webpack, boilerplate
Preact Starter
Webpack3 boilerplate for building SPA / PWA / offline front-end apps with Preact
Stars: ✭ 384 (+1180%)
Mutual labels:  webpack, boilerplate
Webpack Boilerplate
A minimal webpack 5 boilerplate with only Babel, SASS and lodash (optional) on board
Stars: ✭ 404 (+1246.67%)
Mutual labels:  webpack, boilerplate
Bozon
🛠 Command line tool for building, testing and publishing modern Electron applications
Stars: ✭ 687 (+2190%)
Mutual labels:  webpack, boilerplate
Thinkful Workshop React Redux Node Mongodb Webpack2
Stars: ✭ 12 (-60%)
Mutual labels:  webpack, boilerplate
View All Similar Projects ➔

An Angular 2 + Webpack boilerplate with examples

Angular 2 application with some examples (currently only HTTP service and component). Please, feel free to create issues and PRs.

Templates and stylesheets are embedded into JS bundle with help of angular2-template-loader. SASS/SCSS is used for styling.

index.html is generated using html-webpack-plugin.

Hot module replacement is not provided here. Possibly I'll add it later. Same goes for service workers.

Installation

Clone repository and run npm install.

Run npm start and point your browser to http://localhost:9045/.

Testing

Use npm test to run test suite. Karma is used as test runner, Jasmine - as testing framework. Code coverage reports are generated using istanbul and remap-istanbul (this provides possibility to map back to TypeScript).

Use npm lint to check TypeScript files (via tslint) and SASS stylesheets (via sass-lint). Codelyzer helps to keep code close to Angular 2 Style Guide.

You won't find end-to-end tests in this project (usually people use Protractor for this purpose). I believe that E2E/QA testing should be written in a separate project/repository, especially if you are working on projects with microservice architecture.

Building bundle(s)

Use npm run build and you will get JS bundles, their maps and index.html in dist directory.

To build for production, use NODE_ENV=production npm run build (webpack configuration is chosen according to this environment variable).

Documentation

Run npm run docs to generate documentation for TypeScript (typedoc is used for that) and SASS stylesheets (done with kss-node).

Dev notes

  • Upgrade to [email protected] breaks code coverage

  • Upgrade to [email protected]* leads to error in their binary (SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode).

TODOs

  • Examples

    • Typeahead with throttle/distinct
    • Pipe
    • AuthGuard in router
    • Forms
    • Input and Output
    • rxjs-based WebSocket

  • Comments on tests

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].