Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

slush-jspm-react-seed

Elephantseed71MIT2.1.4

Slush for scaffolding, Jspm for packaging, React for templating framework

slush, jspm, nodejs, react, boostrap, reactbootstrap

readme

Whalephant Seed

oficial site built without gulp Dependencies CircleCI

Elephant Seed

This project has migrated to ![Whalephant Seed]

Features out-of-the-box

    NEW! Added Docker support

    NEW! Added live reload with Browser-Sync

    Improved loading times in production bundle

    Added working ESlint out-of-the-box

    Codeclimate ready

    Added floating notifications using toastr

    Firebase 3.0 friendly, just login with your account and deploy

    Minimum possible configuration, maximum features,
    judge by yourself

    Use NodeJS packages (>= 300000 available)

    JSPM for universal Javascript package managing

    ES6 & ES7 Syntactic Sugar ready out-of-the-box

    Bundling & Minifying (JSPM native)

    NodeSASS for scss2css 

    Added 7 to 1 for managing styles 
    https://github.com/HugoGiraudel/sass-boilerplate

    No Grunt/Gulp/Broccoli/Cake/Whatever... needed at the time of writing, 
    let's see if we can build the whole seed without them.

Getting Started

Install slush-jspm-react-seed globally:

$ npm install -g slush-jspm-react-seed

Usage

  • Create a new folder for your project:
$ mkdir my-whalephant-seed
  • Run the generator from within the new folder and download deps after:
$ cd my-whalephant-seed
$ slush jspm-react-seed
$ npm run init

Node Commands

Dockerless NodeJS Server with unbundled dependencies using https via Browser-Sync

(includes live reload, Browser-Sync will open the website for you)

$ npm run dev:node

Dockerless NodeJS Server with bundled dependencies using https via Browser-Sync

(includes live reload and source maps)

$ npm run prod:node

Docker Commands

Docker Nginx + Docker NodeJS Server with HTTPS and custom domain

(Observe that is not possible to reload and focus the browser from inside a container, every change you made will be reflected but you will have to manually refresh the website)

$ npm run start:docker
$ open https://docker.nginx.node.com

Run arbitrary command inside the container

$ npm run exec:docker -- echo 'I am inside the container'

Run arbitrary command inside the container (docker natively)

$ docker-compose run --rm node-server /bin/bash -c 'echo "I am inside the container"'

Enter running Docker Node container

$ npm run enter:docker

Docker-compose build

$ npm run build:docker

Stop and clean all instances, images, containers and volumes of this application

$ npm run clean:docker

JSPM Commands

Bundle application dependencies

$ npm run bundle:jspm

Unbundle application dependencies

$ npm run unbundle:jspm

ESlint Commands

$ npm run check:eslint

NodeSass Commands

$ npm run buildcss:nodesass

Deploy in Firebase

You have to login via command line in your OWN account):

$ firebase deploy

Common Pitfalls

  • If your connection is slow then sometimes jspm i may have hiccups while doing look ups trying to download dependencies, just wait for it to finish and repeat jspm i few times until it manages to download all dependencies, eventually you may try to slush jspm-react-seed again in a clean folder if the installer gets stuck. You may see messages like this is that situation
       warn It's taking a long time to process the dependencies of npm:core-util-is@1.0.2.
            This package may need an ignore property to indicate test or example folders for jspm to skip.
  • While using the seed with you preferred CI you may see this error: ` Updating registry cache... Looking up github:twbs/bootstrap Downloading github:twbs/bootstrap@3.3.1

err Error downloading github:twbs/bootstrap

 GitHub rate limit reached. To increase the limit use GitHub authentication.
 Run jspm endpoint config github to set this up.

warn Installation changes not saved.

Fear not, here you can see how to overcome the problem, unfortunately the seed can't do that for you:
https://github.com/jspm/jspm-cli/blob/master/docs/registries.md

* When eslint finds an error you may see an error message coming from npm, this is normal, just fix the linting
   error and you won't see it anymore

* No space left on device!, you can solve it deleting this file

```bash
$ ls -lah ~/Library/Containers/com.docker.docker/Data/com.docker.driver.amd64-linux/Docker.qcow2
  • Not connecting to the Docker container:
ERROR: dial unix /Users/sloppylopez/Library/Containers/com.docker.docker/Data/00000003.00000948: connect: connection refused

npm ERR! Darwin 16.7.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "start:docker"

Solve it using :

$ npm run clean:docker

Contributing

See the CONTRIBUTING Guidelines

Support

If you have any problem or suggestion please open an issue here.

License

The MIT License

Copyright (c) 2017, Sergio Lopez

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

changelog

v2.1.4 date: 2017-09-29 changes:

- Change image in readme

v2.1.0 date: 2017-09-29 changes:

- Fixed infinite loop on cssbuild

v2.0.9 date: 2017-09-29 changes:

- Improved documentation

v2.0.8 date: 2017-09-29 changes:

- Fixed bug with css automatic building
- Added ESlint

v2.0.6 date: 2017-09-28 changes:

- Corrected info in readme

v2.0.0 date: 2017-09-28 changes:

- Added Docker support
- Added live-reload inter-container with browser-sync
- Blazingly fast builds and smooth development experience
- Shrinkwrapped for being idempotent

v1.3.0 date: 2016-09-25 changes:

- The automatic jspm installation is causing problems in some devices, reverted to manual install

TBR: Live reloading does reload scss with lite-server per se, we will fix that

v1.2.9 date: 2016-06-29 changes:

- Fixed bug in letters size

TBR: Live reloading does reload scss with lite-server per se, we will fix that

v1.2.8 date: 2016-06-29 changes:

- Fixed jumbotron responsivenes
- Fixed strange bug with font sizes for some 'features' in home page

TBR: Live reloading does reload scss with lite-server per se, we will fix that

v1.2.7 date: 2016-06-28 changes:

- Removed repeated stylesheets folder

v1.2.6 date: 2016-06-28 changes:

- Speeded up production loading times, from 5 seconds to 1 using sfx bundling

v1.2.5 date: 2016-06-28 changes:

- Optimized all dependencies
- Execute 'jspm i' automatically after growing the seed
- Added dependencies badge
- Modified readme

v1.2.4 date: 2016-06-27 changes:

- Updated all dependencies of the slush part
- Critical bug fixed :missing lite-server dependency

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.2.3 date: 2016-06-27 changes:

- Updated all dependencies

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.2.2 date: 2016-06-27 changes:

- Optimized codeclimate measurements for the project and the resulting seed
- Fixed linting errors

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.2.1 date: 2016-06-25 changes:

- Fixed code climate build

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.2.0 date: 2016-06-25 changes:

- Fixed bug in documentation

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.1.9 date: 2016-06-25 changes:

- Updated readme information again, simplified

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.1.8 date: 2016-06-25 changes:

- Updated readme information

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.1.7 date: 2016-06-25 changes:

- Removed unneeded server.js

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.1.6 date: 2016-06-25 changes:

- Fixed routing DEEPLINKING day 0 bug, changed history for browserhistory front react router
- Refactored app.js using ES6 syntactic sugar

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.1.5 date: 2016-06-25 changes:

- Added eslint script to package.json

TBR:

- Execute 'jspm i' automatically after growing the seed
- fix routing

v1.1.4 date: 2016-06-25 changes:

- Codeclimate ready
- Added latest version of eslint
- Improved README.md files info

TBR:

- Execute 'jspm i' automatically after growing the seed
- fix routing

v1.1.3 date: 2016-06-24 changes:

- Upgraded to firebase 3.0
- Changed README.md

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.1.2 date: 2016-06-23 changes:

- Added missing image

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.1.1 date: 2016-06-23 changes:

- Added live reload in development mode using lite-server which is way more handly and less config involved
- Added floating notifications using toastr

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.1.0 date: 2016-01-30 changes:

- Added live reload in development mode
- Refactores package.json to user bin scripts, nicer for flexibility and scalability of the build process, 100% Gulpless/Gruntless

known bugs:

- In production mode you may see an error from the livereload Chrome plug in, this is normal, and maybe not solvable but it does not impct anything

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.0.9 date: 2016-01-26 changes:

- Refactored npm scripts to folder bin for scalability
- Added watch feature for doing scss -> css using nodemon

known bugs:

- The router does not allow deep-links at the moment

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.0.8 date: 2016-01-25 changes:

- Modified README

known bugs:

- The router does not allow deep-links at the moment

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.0.7 date: 2016-01-25 changes:

- Cosmetics changes mobile friendly
- Solved problem of slowness caused by compilation of scss browser side, now we create css before doing 'jspm server start'

known bugs:

- The router does not allow deep-links at the moment

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.0.6 date: 2016-01-24 changes:

- Cosmetics changes only

known bugs:

- The router does not allow deep-links at the moment

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.0.5 date: 2016-01-23 changes:

- Quick Fix for image corruption when generating the seed since the official solution does not seem to work and I am wasting time with a minor
  https://github.com/slushjs/slush/issues/46
- Re-styled to be more mobile friendly
- Bundle sfx for being able to gtmetrix the production site
- Added jspm cache
- Added sfx bundling
- Removed redundant lines in server.js
- Added alt to image

known bugs:jspm

- The router does not allow deep-links at the moment

TBR:

- Execute 'jspm i' automatically after growing the seed

v1.0.4 date: 2016-01-14 changes:

- Fixed script in package.json redundant
- Fixed typo
- Fixed error in firebase.json about the public folder incorrectly setted
- Removed loading of firebase-rules from firebase.json

known bugs:

- It's very slow serving the website because of the browser side scss compilation and the Babel transpilation, needs fix
- The router does not allow deep-links at the moment

v1.0.3 date: 2016-01-13 changes:

- Added additional info
- Fixed broken link
- Firebase ready
- Website online https://elephantseed.firebaseapp.com

known bugs:

- It's very slow serving the website because of the browser side scss compilation and the Babel transpilation, needs fix

v1.0.2 date: 2015-12-07 changes:

- Improved logo
- Added features info
- Minor css changes

v1.0.1 date: 2015-12-07 changes:

- Fixed bug with resposiveness
- Added proper logo ElephantSeed

v1.0.0 date: 2015-12-06 changes:

- Added full Sass support
- Added pattern 7 to 1 for styles folder https://github.com/HugoGiraudel/sass-boilerplate
- Added sticky footer
- Added proper Home
- Fist version ready!!
- Big Refactor

v0.2.0 date: 2015-12-05 changes:

- Jspm installed npm:clean-css@ to fix Codeship build
- Added example codeship_build_config_example.md
- Ditched Travis in favor of Codeship as preferred ci-cd system, it's simply better

v0.1.9 date: 2015-12-05 changes:

- :bug: Fix Codeship build using jspm registry
- Fixed technical debt importing css from bootstrap
- Created folder components, added header as part of a small refactor

v0.1.8: date: 2015-12-03 changes:

- Fixed README.md
- :bug: Detected in Travil build... Github has a max quota it seems. TODO localize bootstrap

v0.1.7: date: 2015-12-03 changes:

- Decorated README.md
_ Fix Travis build

v0.1.6: date: 2015-12-03 changes:

- Edited text

v0.1.5: date: 2015-12-03 changes:

- Added React-Boostrap which works charmly
- Added some goodies in package.json and extra relevant info about a :bug: in the cache of jspm (apparently)

v0.1.4: date: 2015-12-02 changes:

- Added proper info to README.md

v0.1.3: date: 2015-12-02 changes:

- Ditched npm:material-ui@^0.13.4, it simply does not work...
- :bug: Fix in package.json for the actions npm:start and npm run start:build because they were overlapping
- Refactor id="root" for id="app"

v0.1.2: date: 2015-12-01 changes:

- Removed unneeded plugin-jsx
- Added npm:react-router
- Added npm:history
- Removed jsx since they don't add much, and can cause trouble, plus babel transpiles js as well

v0.1.1: date: 2015-11-30 changes:

- Small refactor of index.html moved to root folder
- Added Babel transpiling capabilities to use via npm script.
- Added Jspm bundling capabilities to use via npm script.

v0.1.0: date: 2015-3-26 changes:

- Initial release.