Live data from Hacker News

React Tutorial: Cloning Yelp

fullstackreact.com

151–160 of 258 posts

Re: React Tutorial: Cloning Yelp

#151
post #145

Earlier quoted context omitted.

What are you doing with python and go that "just works"? Writing scripts? It takes a lot more work to build a yelp clone with python than it does with react.

> What are you doing with python and go that "just works"? Anything you want. Dependency management is taken care of by a simple `pip install flask`, or a requirements.txt. The rest depends on the packages you are using. > It takes a lot more work to build a yelp clone with python than it does with react. And why do you think that? I could build a simple and performant Yelp clone with full authentication, admin acces…

Yeah so it's really not very simple.

Re: React Tutorial: Cloning Yelp

#152
post #145

Earlier quoted context omitted.

> What are you doing with python and go that "just works"? Anything you want. Dependency management is taken care of by a simple `pip install flask`, or a requirements.txt. The rest depends on the packages you are using. > It takes a lot more work to build a yelp clone with python than it does with react. And why do you think that? I could build a simple and performant Yelp clone with full authentication, admin acces…

Yeah so it's really not very simple.

Well yeah, it's not really an apples to apples comparison. A Yelp clone written in React lacks user auth, persistence, and admin.

Re: React Tutorial: Cloning Yelp

#153
I've built a multitude of websites/applications in my lifetime spanning many different programming languages, build systems, tools, etc. From PHP, to python, to golang, to java, and JS. It seems painfully obvious to me that the people complaining about this setup/build system do not fully grasp the power and beauty of the JS ecosystem, more specifically react, redux, time traveling, and hot module reloading. It is without competition, the best development experience I have ever had been apart of. There is no lag time between when I make a change in JS or CSS to when those changes get applied to the application. There's no compiling (even tho there is a compile step), no refreshing the page, no stepping through all your previous steps to get to that part of the application, your changes are patched in real time and available to you automatically.

I guess the saying is true, that haters are going to hate, but there really is no competition in terms of development experience once you grok the ecosystem.

Re: React Tutorial: Cloning Yelp

#154

I've been on the fence for quite a while, but a couple of weeks ago I finally bit the bullet and taught myself webpack, ES6, React, CSS modules, Redux, and everything else that comes along with these tools. It definitely felt like relearning my job (coming from working with Grunt, Backbone and jQuery) and it took a lot of time and effort to really get to understand everything (still learning many new things each day)…

> a couple of weeks ago I finally bit the bullet and taught myself webpack, ES6, React, CSS modules, Redux, and everything else that comes along with these tools

Can you share how you did that? Was it a number of different resources you consulted, or is there some all-in-one resource you found?

Re: React Tutorial: Cloning Yelp

#155
post #3

To me this epitomizes what I feel as I'm trying to explore options for different front-end frameworks. In this article I'm 30 screens down (literally 30 page down presses) and it's not even finished setting up the environment and dependencies. Sure, this is something that you only do once, so if it then leads to much better development workflow it makes sense to have a solid investment upfront, but it makes it very h…

The real gut punch is many parts of this tutorial will probably be obsolete within six months. Fast forward a couple years and this will look like the equivalent of "Backbonejs tutorial - Step 1: bower install requirejs".

Sometimes I feel bad complaining about this. Things are evolving fast for a reason. Everyone is trying to make every part of this process better. The backbone joke above illustrates the point. Would you go back in time and freeze the evolution just to regain sanity for today's devs?

Re: React Tutorial: Cloning Yelp

#158

I also got frustrated by the setup time for a simple react app, so I make a starter repo that I just clone for all my new projects. It's made to be as simple, light, and understandable as possible while still being useful. Check it out and let me know if you have any questions! https://github.com/hammeiam/react-webpack-starter

I like it. Thanks!

Re: React Tutorial: Cloning Yelp

#159
post #140
post #40

Great work on the tutorial. I'm sure it took a lot of time to setup, and it seems well written. However I simply won't believe that setting up a simple React app requires so much overhead. Granted, I have no experience with React, and only marginal experience with frontend web dev. As I read the tutorial, this is the list of questions I had: 1. Why do we need so many Babel presets? What do they do? 2. Why do we need…

1. you don't need them all, but for using the latest ES future spec and ideas and hot reloading they are needed. es2015 : to use ES6, stage-0: all babel plugins: async/await, 2 2, trailing comma a(1,2,), spread {1, ...a}, and more : http://babeljs.io/docs/plugins/preset-stage-0/ the react plugin is to transform the JSX syntax , and react-hmre is a preset for hot reloading. 2. we need webpack to bundle the js, jsx, cs…

Wow, thanks for going through them one by one!

Re: React Tutorial: Cloning Yelp

#160
post #40

Great work on the tutorial. I'm sure it took a lot of time to setup, and it seems well written. However I simply won't believe that setting up a simple React app requires so much overhead. Granted, I have no experience with React, and only marginal experience with frontend web dev. As I read the tutorial, this is the list of questions I had: 1. Why do we need so many Babel presets? What do they do? 2. Why do we need…

This is how I start off a React app: $ npm install --save react react-dom $ npm install --save-dev webpack webpack-dev-server babel-core babel-preset-es2015 babel-preset-react react-addons-test-utils /webpack.config.js module.exports = { entry: 'src/index.js', output: 'dist/bundle.js', module: { loaders: [{ test: /\.jsx?$/, exclude: /node_modules/, loader: 'babel', query: { presets: ['es2015', 'react'] } }] } } /src/…

Yep, that looks much cleaner and easier to reason about. Thanks for the sample config file.
Post reply on HN