Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

React Tutorial: Cloning Yelp

fullstackreact.com

Post reply on HN
Print view View original

71–80 of 258 posts

Re: React Tutorial: Cloning Yelp

#71

Post by moogleii »

fbonetti wrote: post #52
eterm wrote: 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…

This is why I'm so gung ho about Elm. To create a proper React single page app, you need React, Redux, lodash, react-router, webpack, Immutable.js, babel, npm, redux-thunk, isomorphic-fetch, webpack-hot-middleware, and ton of boilerplate and configuration (which everyone does differently). You can try to assemble this yourself, or choose one of hundreds of starter projects on Github. A comparable Elm app is a lot sim…

I've no doubt Elm is simpler (considering it's more vertically integrated), but to be fair, if webpack is a maybe in Elm, lodash, immutable, isomorphic fetch, and webpack-hot-middleware would definitely be on my maybe list for React. Maybe maybes would include redux-thunk.

Re: React Tutorial: Cloning Yelp

#72

Post by tlrobinson »

swanson wrote: post #48

I'm no Javascript Boilerplate Fatigue apologist, but there are many comments in here that are treating this as a "Learn how to use React" tutorial. This is not what is advertised nor the stated reason this article was written. From the first sentence: "we get a lot of questions about how to build large applications with React and how to integrate external APIs" Large application strucutre, external integrations...not…

I'm a fan of projects like https://github.com/petehunt/rwb

It's a little opinionated but aligns well with the decisions I independently made after spending way too much time on "build tool bullshit". That said, it's a little rough around the edges and development is not very active.

Re: React Tutorial: Cloning Yelp

#73

Post by ryanSrich »

lopatin wrote: post #60
ryanSrich wrote: post #35

Earlier quoted context omitted.

Sorry, I should have been more clear. What I meant was that your web app will never be as complex and resource demanding as Facebook. The reason why React is so complex is because it's intended for complex systems. If you want to quickly build a one off web app you shouldn't be using React imo. The length and complexity of this tutorial is a testament to that.

React is simple, not complex. Simplicity is like the main benefit of using React if your intention is to build a single page app. If that's not what you need, then yeah, use Rails.

React in a vacuum might be. React in the context of building a real application is not.

Re: React Tutorial: Cloning Yelp

#74

Post by ctvo »

ryanSrich wrote: post #14
pjs_ wrote: post #11

This genuinely made me feel ill. The author has done a tremendous service to others - clearly and patiently listing the thousands of steps required to get a basic modern web app up and running. I agree with others that it is often difficult to find all the steps for a process like this in one place. At the same time, this is completely, totally fucking insane.

React was built by Facebook. Facebook has 1 billion users. If you're looking to build a fast, simple, web app look at rails or Phoenix, not React.

React itself is a view library with a very small learning curve and narrow API. You can view all the documentation on their website. It's about 5 pages. This has nothing to do with Facebook's scale and Facebook didn't design this complexity.

Webpack isn't React, Redux isn't React, ES2015 isn't React. They're commonly used with React and add complexity to both your architecture and build step, but you're not required to use them.

This tutorial is getting a lot of negative replies because it's a tutorial on all those other things in addition to React. It takes 90 pages before you write React code because the author spent a lot of it explaining how Webpack configurations work.

Re: React Tutorial: Cloning Yelp

#75

Post by bdcravens »

pkd wrote: post #34
swanson wrote: post #13

Earlier quoted context omitted.

I've shared your frustration. The Hello World experience is a huge spectrum ranging from the 30 screens of setup you describe to the one-click Visual Studio installer. The other thing to consider is what you assume from a reader in a tutorial. If you assume they have a full environment setup (or will be following another tutorial), you can put together a much more concise article. Imagine the now-classic Rails Blog i…

That's an unfair comparison. You are building the whole Ruby dev environment from scratch before coming to Rails. Which is not what is happening in the tutorial. Actually, if you have the typical ruby environment setup already (ruby, rubygems, bundler), then its only gem install rails rails new rails s You don't need postgres or any JS runtime to start off.

If you were trying to learn Rails (which this story ostensibly is doing with React) you wouldn't have Ruby installed. (or you'd be using system Ruby, which you generally shouldn't use: https://robots.thoughtbot.com/psa-do-not-use-system-ruby)

Re: React Tutorial: Cloning Yelp

#76

Post by csallen »

wale wrote: post #67
csallen wrote: post #46

Earlier quoted context omitted.

To be fair, the parent to your comment included lots of steps that assumed the user was starting from scratch. If we assume the same for the user making an Express app, the steps are much more complex: * Install a C++ compiler (XCode or libssl-dev packages) * Run the NVM install script * Use NVM to install Node.js * npm install express-generator -g * express myapp * cd myapp; npm install * Install or update Homebrew…

Really? This steps you just listed are similarly complex to what's in that React article? No No bruh.... 30 screens -- down-button-presses down and we're still seting up for a frontend sample app. This is so so an issue, Node(backend), Go and Rails and Py aint got.

I'm not comparing my steps to the React article. I'm comparing them to the steps in the comment I was responding to.

Anyway, measuring steps in terms of "screens" is woefully inaccurate. For example, the author of the post uses more than one screen on simply running `npm init`, because he includes unnecessary paragraphs and screenshots. Many other parts of his post are even more verbose.

I could rewrite the first 30 "screens" of his post in 1-2 "screens". Would that mean that the process is suddenly 30x easier?

Re: React Tutorial: Cloning Yelp

#77

Post by bdcravens »

pbreit wrote: post #18
swanson wrote: post #13

Earlier quoted context omitted.

I've shared your frustration. The Hello World experience is a huge spectrum ranging from the 30 screens of setup you describe to the one-click Visual Studio installer. The other thing to consider is what you assume from a reader in a tutorial. If you assume they have a full environment setup (or will be following another tutorial), you can put together a much more concise article. Imagine the now-classic Rails Blog i…

But wouldn't it just be: * install rails * run 'rails s'

If you've already setup Ruby, which most haven't if they're going through a similar tutorial for Rails.

Re: React Tutorial: Cloning Yelp

#79

Post by sergiotapia »

eterm wrote: 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…

Screw this, use Meteor to build React apps. It's super smooth, no BS, and integrates everything that sucks about Javascript development into a cohesive Omakase package.
Post reply on HN