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

191–200 of 258 posts

Re: React Tutorial: Cloning Yelp

#191

Post by EdwardDiego »

Cyph0n wrote: post #145
zxcvcxz wrote: post #131

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…

> Anything you want. Dependency management is taken care of by a simple `pip install flask`, or a requirements.txt.

And what if I want to use multiple versions of a given library for my development? Suddenly I'm learning virtualenv...

Re: React Tutorial: Cloning Yelp

#192

Post by jimmytucson »

spicyj wrote: post #139
jimmytucson wrote: post #103

Earlier quoted context omitted.

Sorry, but even the “Getting Started” guide on React's website requires that you have a "CommonJS module system" installed which, if you don't, means you have to make an intelligent choice between Browserify and webpack, which means you have to do some minimal research into what those are (and probably research "babel-js", while you're at it), install one of them using npm, which may require that you install or upgra…

I'm having trouble understanding your comment. Neither the homepage, Getting Started, the tutorial, nor the downloads page mentions CommonJS. If you do choose to use browserify or webpack, you'll want Node and npm, but Node's homepage doesn't suggest using Homebrew so I'm not sure why that would be necessary. (Besides, in my experience, most programmers using a Mac have Homebrew already.) > When you actually get into…

My comment was based on notes I took from a little over a month ago, when the Getting Started guide said "We recommend using React with a CommonJS module system like browserify or webpack."

https://web.archive.org/web/20160411175140/https://facebook....

Re: React Tutorial: Cloning Yelp

#193

Post by spicyj »

jimmytucson wrote: post #192
spicyj wrote: post #139

Earlier quoted context omitted.

I'm having trouble understanding your comment. Neither the homepage, Getting Started, the tutorial, nor the downloads page mentions CommonJS. If you do choose to use browserify or webpack, you'll want Node and npm, but Node's homepage doesn't suggest using Homebrew so I'm not sure why that would be necessary. (Besides, in my experience, most programmers using a Mac have Homebrew already.) > When you actually get into…

My comment was based on notes I took from a little over a month ago, when the Getting Started guide said "We recommend using React with a CommonJS module system like browserify or webpack." https://web.archive.org/web/20160411175140/https://facebook....

Ah, indeed. Looks like we tried to simplify it recently:

https://github.com/facebook/react/pull/6148

Re: React Tutorial: Cloning Yelp

#194

Post by dan15 »

sdnguyen90 wrote: post #149
Cyph0n wrote: 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/…

Out of curiosity, why did you write the function like this:

   const MyRootComponent = (props) => {
When it's shorter and more obvious what's happening if you write them like this:

  function MyRootComponent(props) {

Re: React Tutorial: Cloning Yelp

#195

Post by mercurial »

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

The problem with the massive amount of churn is that it just doesn't pay off to learn the new, cool thing when it's going to be obsolete in 3 months or less. I think all programmers, especially ones who read HN, like to learn new things. It's fun to pick up new languages, learn new paradigms, and experiment with different technologies. What's not fun is learning 10 different ways to handle promises, 4 different build…

> What's not fun is learning 10 different ways to handle promises, 4 different build tools, several frameworks, and dozens of new libraries over the course of a year just to keep up. By the time you reach a level of mastery over one of these tools, it's already been replaced by something else! I mean it's great that the tools are getting better, but it's really painful to deal with the constant churn.

I feel your pain, but on the other hand:

- tools with enough users are not going away, even if they're less actively maintained

- it's not like sticking to HTML + jQuery is desirable if you need to build a complex UI

Re: React Tutorial: Cloning Yelp

#197

Post by ocean3 »

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.

You don't need all of them to create a modern js app. I use just browserify and watchify with node scripts under package.json. Simple to copy and modify for new projects.

Re: React Tutorial: Cloning Yelp

#198

Post by ocean3 »

ryanSrich wrote: post #35
zxcvcxz wrote: post #31

Earlier quoted context omitted.

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.

React is just for view layer. Its not much complex. Its simple enough to add to normal pages let alone SPA.

Re: React Tutorial: Cloning Yelp

#199

Post by zeemonkee3 »

sdnguyen90 wrote: post #149
Cyph0n wrote: 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/…

> There is nothing forcing you to use all the extra dependencies

This right here is a major problem with a ton of apologists. "You don't need to use X and Y, just start with barebones Z".

If you're doing your own side project, sure. Or if you're lucky to be developer #1 in a greenfield project. I can count on one hand the number of times in my career that's happened.

Most of the time, you're going to be maintaining someone else's work. They'll have a ton of dependencies and glue and workarounds, and you're really, really lucky if they've written tests or documentation. So all the complexity mentioned in the article? You get to deal with that, only not so neatly put together. More likely they'll have an out-of-date version of react-router that's incompatible with the library you're trying to install, upgrading react-router means rewriting a ton of code because they love to change their API every other release....

Now I like React, and I've built things with it. But there is a huge and growing PR problem with it right now, that for all its promise there is too much incidental complexity, too many ways to do it, a lack of standardization around things like build tools. Companies aren't overjoyed at having codebases that become impossible to maintain 6 months out, when the frontend devs jump ship. Whether the answer is a more structured framework like Ember or Angular, I don't know, but there is a lot of fatigue and frustration around trying to build and maintain a project out of lots of tiny pieces, and it's showing in this thread.

Re: React Tutorial: Cloning Yelp

#200

Post by dwaltrip »

keyle wrote: post #148

I've dealt with many technology stacks. If this is the future, we're F#$$%. Seriously, how can people be blasting older technology like Flash and Flex (which was GREAT), out of the water for not using web standards and then this Frankenstein of a "stack" is going so mainstream. Sure, there is the VM problem, but the language was good and so was the framework. This looks horrendous and scary. Imagine maintaining this…

You should check out http://mithril.js.org/.

It's been around for a few years, it's very lightweight with a small API, not opinionated, and surprisingly powerful. It doesn't have all the wiz bang gadgets right of the box, but it provides the fundamentals you need for a well designed, full-fledged frontend app.

I've enjoyed using it a lot the past few months on a few small projects, and I'm also using it for a larger project that I've just started working on.

Oh also, I haven't even bothered with a build tool or anything yet (I find the current js build tool landscape rather dismal). Turns out it is surprisingly easy to get by with lines into index.html for smaller/mid-sized apps =) The only thing I've really missed so far is SASS.

Post reply on HN