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

31–40 of 258 posts

Re: React Tutorial: Cloning Yelp

#31

Post by zxcvcxz »

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.

What's wrong with react? If it's good enough for facebook and good enough for the hundreds of other high traffic sites, then it's good enough for me.

Of course I also like to stay employed and react is the most in demand framework right now.

Re: React Tutorial: Cloning Yelp

#32

Post by enraged_camel »

sotojuan wrote: post #7
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 a pet peeve of mine when it comes to React tutorials. Why waste so much time making the user set up a dev environment? Just give him/her a prebuilt and "black boxed" environment and get on with learning React (what they actually want to do). I've seen plenty of people give up because they couldn't get their webpack set up right. Also, for those making courses, consider just using browserify. It's much easier…

>>This is a pet peeve of mine when it comes to React tutorials. Why waste so much time making the user set up a dev environment? Just give him/her a prebuilt and "black boxed" environment and get on with learning React

And yet one of the most common criticisms of Rails is that it's too black-box and has too much "magic."

So you're damned if you do, damned if you don't.

Re: React Tutorial: Cloning Yelp

#34

Post by pkd »

swanson wrote: post #13
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…

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.

Re: React Tutorial: Cloning Yelp

#35

Post by ryanSrich »

zxcvcxz wrote: post #31
ryanSrich wrote: post #14

Earlier quoted context omitted.

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.

What's wrong with react? If it's good enough for facebook and good enough for the hundreds of other high traffic sites, then it's good enough for me. Of course I also like to stay employed and react is the most in demand framework right now.

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.

Re: React Tutorial: Cloning Yelp

#36

Post by lucideer »

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…

It's literally 93 page-downs to the "Hello world"

On the upside, it all seems clear (if somewhat laborious to go through in totality) and I definitely appreciate that the majority of those 93 page-downs were covering setting up testing and a testing strategy + framework. It seems most things of this type are more likely to either say "set up testing" without detail, OR are guides specifically for doing testing without going into great detail about the app being tested.

Re: React Tutorial: Cloning Yelp

#37

Post by sotojuan »

firasd wrote: post #27
sotojuan wrote: post #23

Earlier quoted context omitted.

I'm interested about why you mentioned Node—aside from the occasional silliness of npm I find it easy and quick with minimal to no boilerplate.

What people refer to as boilerplate for setting up React, including in this article, is about installing and configuring node modules, build systems and other tools. React itself is just two modules (React, React-DOM.)

Got it. Thought you meant just Node. Thanks for clearing it up.

Re: React Tutorial: Cloning Yelp

#38

Post by 010a »

swanson wrote: post #13
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…

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…

I really feel like this isn't a general problem, but rather a problem with a subset of development environments.

Node (backend) definitely doesn't have a similar problem. Want an express app? Install node -> npm i express --save -> node app.js.

Go doesn't have it either, whether you're using the base tool or GVM. Python requires a minuscule setup in virtualenv, but beyond that its straightforward. Elixir and Rust are straight-forward.

In fact, the only environments where I've ever thought "wow this is a configuration nightmare" are front-end web dev, Ruby, and in really complex python apps, obviously notwithstanding less common app environments like C/C++.

Re: React Tutorial: Cloning Yelp

#39

Post by pauljohncleary »

zxcvcxz wrote: post #17
pauljohncleary wrote: post #10

Earlier quoted context omitted.

> the same frustrations when I was looking at things like meteor The main strength of Meteor is the speed you can get up and running $ meteor create my-app-name $ meteor npm install $ meteor will set you up with a full stack application, running locally, with zero config

The thing is with Meteor I feel like I have to learn ALL of meteor to really expand/extend upon what it gives me or use some plugin, it feels like it takes away way too much control for me. With Angular I feel like I have to re-learn web development and do everything the "angular way", and who knows when Angular three comes out and the "Angular way" completely changes. With React, I can learn a small framework that's…

Fair point, recent updates to Meteor (1.3) have made it much easier to use with the rest of the JS ecosystem (e.g. using react with meteor is as easy as using the default view library).

The reason you have all of this boilerplate setup with react is because it's only one small part of the equation, so you need to use and (ideally) understand a bunch of other libraries and tools to build something, hence these epic tutorials.

Re: React Tutorial: Cloning Yelp

#40

Post by Cyph0n »

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 Webpack exactly? Why not use a traditional build system like Gulp?

3. Why is Webpack so difficult to setup? Are there no pre-configured setups for React?

4. What the hell is postcss? Are Less and Sass out of fashion now?

5. And why all this added complexity to setup CSS? They are only stylesheets for God's sake!

6. Oh, so now we need to configure Webpack to support postcss? The definition of reinventing the wheel. Is there no plugin system for Webpack?

7. Why is it so complicated to setup multiple environments using Node and Webpack?

Phew, looks like we're done -- nope, we're not.

8. So many libraries just to setup a testing environment? I wouldn't be surprised if frontend apps aren't well tested...

9. Ah, we also need a "JSON loader", whatever the hell that is.

10. Great, another CLI tool for testing. And more configuration of course.

11. Webpack once more needs to be configured to support our new testing app.

12. We need a better spec reporter? Why? More configuration...

13. More Webpack configuration.. I'm already sick of it.

So many things to keep in mind, so many dependencies, so very many points of failure. If just one of these libraries is abandoned, or has a breaking change, your entire development environment is dead. Is this the current state of frontend web dev, or are these guys just overdoing it for the sake of the tutorial?

I find this all weird because I have the habit of thinking very carefully about every single dependency when I'm writing software. Do I really need it i.e. can the same task be achieved using the standard library? If not, how active is the development of the library (recent activity, issue response time, number of contributors)? How many libraries does it depend on - the fewer, the better? And even with all this, it's still not guaranteed that things will go smoothly!

Post reply on HN