TypeScript SPA Boilerplate
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
dist
src
.dockerignore
.editorconfig
.env.default
.eslintignore
.eslintrc
.gitattributes
.gitignore
Dockerfile
LICENSE
README.md
contributors.md
docker-compose.yml
jest.config.js
makefile.js
package-lock.json
package.json
postcss.config.js
server.js
tsconfig.json
webpack.config.js

README.md

TypeScript SPA Boilerplate

TypeScript SPA Boilerplate is a front-end development stack for starting with a structured, scaleable and adaptable basecode.

This project is the product of many years of iterative development and combined community knowledge. It does not impose a specific development philosophy or framework, so you're free to architect your code in the way that you want.

Features

  • Transforms ES2015+Typescript files with .ts/.tsx extension into browser-compatible JavaScript code.
  • Module bundling with webpack to pack everything into modules.
  • SASS compilation of .scss files.
  • Minification for stylesheets and scripts.
  • Hot module reloading and continuous development environment.
  • Isomorphic/Universal codebase between server and client.
  • IntelliSense support on TypeScript.
  • React DevTools support.
  • Unit-testing-ready environment.
  • JavaScript and CSS linting. (not ready yet)

Architecture and Libraries

  • React for rendering components.
  • React Router for SPA routing.
  • Redux for state management.
  • bulma and Font-Awesome are included.
  • Jest for tests, ESLint for linting.

Quick start

Clone the git repo git clone https://github.com/eserozvataf/ts-spa-boilerplate.git - and checkout the tagged release you'd like to use.

Execute npm install to install dependencies for development environment.

Jsmake Tasks

Ensure that jsmake is installed on your system first. It can be installed by typing the command below on command line:

$ npm install jsmake -g

Use jsmake command in project folder to execute tasks defined in makefile.js.

Task Description
build Builds the project
serve Enables live development environment powered by hot module reloading and browser-sync

Directory Structure

Directory Description
/src/ Bootstrap
/src/app/ Main Application
/src/app/assets/ - Assets (images, fonts, stylesheets, etc.)
/src/app/layouts/ - Layouts / Templates
/src/app/pages/ - Pages

Todo List

See GitHub Projects for more.

Requirements

Notes and Credits

Uses google-webfonts-helper for embedding webfonts.

License

Apache 2.0, for further details, please see LICENSE file

Contributing

See contributors.md

It is publicly open for any contribution. Bugfixes, new features and extra modules are welcome.

  • To contribute to code: Fork the repo, push your changes to your fork, and submit a pull request.
  • To report a bug: If something does not work, please report it using GitHub Issues.

To Support

Visit my patreon profile at patreon.com/eserozvataf