Universal/Isomorphic React TypeScript Starter Project
JavaScript TypeScript CSS
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.
src Minor tslint cleanup Jul 31, 2017
.gitignore Minor changes Jul 30, 2017
LICENSE Update to React 15 Apr 16, 2016
README.md Minor changes Jul 30, 2017
gulpfile.js Fix client path in gulpfile Jul 30, 2017
package.json Minor changes Jul 30, 2017
tsconfig.json Update vendor libraries Jul 19, 2017

README.md

Universal/Isomorphic React TypeScript Starter

This project includes a working example of React, React Router, and TypeScript.

All the code is in TypeScript, written as either .ts or .tsx files. The gulp-based build generates a browserified client file which is separate from the vendor file. The vendor file currently includes react and react-router. This separation speeds up the build process and can result in fewer client downloads when new builds are released. The gulp build process works with gulp.watch.

This is a basic starter project with a minimal number of views and components. Many recent React examples are written in ES6 and make use of Babel. These are largely compatible with this TypeScript based process.

This starter also includes an example of how to use Redux with TypeScript. In order to keep the starter as clean as possible, the Redux example is on a branch.

Features

  • React with React Router
  • Redux (on a separate branch)
  • TypeScript TSX
  • Isomorphic between server and client
  • Client app.js is browserified
  • Client vendor.js is browserified separately
  • Browserify-shim supports external scripts
  • Gulp based build with watch tasks

Versions

This template supports the following versions for key dependencies:

Usage

You'll need a few frameworks and utilities to be installed before starting.

Prerequisites

You'll need the following prior to setup:

Setup

Install Node modules

This will get all the packages required for development and run time, as defined in the package.json file.

> npm update

Install TypeScript definitions

Typings files are now installed using npm. The starter typings should be installed with the above npm update step. The older typings (and even older tsd) process is no longer needed for most packages.

Build

To run a full build, just run gulp with no arguments.

> gulp

You can also use npm.

> npm run build

Development

Run watch and keep the console open.

> gulp watch

Gulp will automatically rebuild when a source file or CSS file changes.

Running

Run this command:

> npm run dev

Then open a browser and navigate to http://localhost:3000 to view.

License

BSD (the same as React)