Git Product home page Git Product logo

watchusbuild-react's Introduction

Babel with Gulp

Starter code for transpiling ES2015 (including modules) with Babel, Gulp and Browserify.

Installing

  1. Clone the repo
  2. npm install -g gulp to install Gulp globally.
  3. npm install to resolve project dependencies.

Using

Run npm start from the command line and you are good to go!

The project is currently setup to transpile code under the /src folder using the /src/app.js file as an entry point.

Our resulting code ends up in the public directory.

Watch the videos

A Code School subscription is required before watching the videos. Don't have one yet? Sign up today!

watchusbuild-react's People

Contributors

caike avatar jonfriskics avatar sergiocruz avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

watchusbuild-react's Issues

How about enabling cache options for Browserify?

After coding for a while, my bundle() started to take about 4-5 seconds, which is quite a lot when developing an app. So I googled around and found out I can actually enable cache options for Browserify.

In gulpfile.bable.js, I changed the following code (btw there're duplicated watchify.args.debug = true; in the code.)

// Input file.
watchify.args.debug = true;
var bundler = browserify('src/app.js', watchify.args);

into

// Input file.
var bundler = browserify({
  entries: ['src/app.js'],
  cache: {},
  packageCache: {},
  debug: true,
  plugin: [watchify],
});

and now bundling became much faster than before. Not really sure that what I've done makes sense so if there's anything wrong please let me know.

Always enjoying your courses and screencasts, thanks!

How to set up proxy?

Hi ! I need to setup proxy , to make all http requests url "/admin/*" from the site "https:/my-test-api.com" go to my localhost:8000
How can I do this in your setup gulp+babel?

Update README

Once filming is done, update README with instructions on installing and running,

React starter pack optimized in cloud9

Hi everyone!

I've been checking the videos throug codeschool's website ( that by the way are fantastic), and I'd like to add an improvement.

I used to work on a cloud IDE called Cloud9, so I wanted to start a new project using your project template that you show on the videos. However, Cloud9 needs a specific configuration for HOST and PORT to work.

If You're going to gulpfile.babel.js and you replace:
gulp.task('serve', ['transpile'], () => sync.init({ server: 'public' }))

for:

gulp.task('serve', ['transpile'], () => sync.init({
    server: 'public' ,
    port: process.env.PORT || 8000,
    host: process.env.IP || "localhost"
}))

It will work perfect.
I thought it could be interesting to explain here because some people are working with a cloud IDE too and it can save up some time trying to figure out why is not working.

Best!
Rubèn

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.