Live data from Hacker News

React Tutorial: Cloning Yelp

fullstackreact.com

221–230 of 258 posts

Re: React Tutorial: Cloning Yelp

#221
post #194

Earlier quoted context omitted.

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) {

"An arrow function expression has a shorter syntax compared to function expressions and lexically binds the this value (does not bind its own this, arguments, super, or new.target). Arrow functions are always anonymous." https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe...

Bad practice according to Airbnb: https://github.com/airbnb/javascript/tree/master/react#class...

Re: React Tutorial: Cloning Yelp

#222
post #180

Earlier quoted context omitted.

> 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? This tutorial is trying to guide you over the initial hump with the tooling by letting you hit the issu…

I am not a front end dev so this is a serious question. The new shiny seems to be using dependencies straight from git and vendoring them. Presumably new versions come out because they fix bugs or security issues. How do you keep your projects up to date? Do you manually check every dependency in your project once in a while? Do you have some automation which alerts you to security issues in a dependency of yours? If…

> The new shiny seems to be using dependencies straight from git and vendoring them.

That's news to me, it's all npm and node_modules/ as far as I can see.

> How do you keep your projects up to date? Do you manually check every dependency in your project once in a while? Do you have some automation which alerts you to security issues in a dependency of yours?

You can get https://greenkeeper.io/ to watch your project and its dependencies - it creates Pull Requests to update dependencies with details of what changed in the description, and all the usual PR stuff like running whatever CI you've configured happens as a result of creating it.

If I don't have Greenkeeper set up (the PRs can get a bit noisy), I just run npm outdated --depth=0 any time I'm poking about in a project.

> If you decide you need to stay on an older version, is someone backporting fixes?

Depends entirely on the maintainers of that project. Babel 5 has had a couple of things backported, like support for Flow annotations, for example.

> Is there a curated set of packages that are known to work together?

Not curated as such, but you can just look at what people are successfully using and sharing, and tools people are creating. nwb is effectively my own curated package of development tools pre-wired together.

> When an update comes in, do you audit it to make sure nothing malicious makes it on to your systems?

I usually check the diff between the release tags/changelogs between what I'm updating to before, but not specifically security auditing.

> Or does one have to wait until this stuff stabilizes and baked it's easy into linux distributions before one gets these nice features?

That's not going to happen :)

Re: React Tutorial: Cloning Yelp

#223

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…

By the same note, you likely won't be writing a complex desktop application without some tooling installed, with similar pre-requisites. I don't know why people get so irritated at "JS tooling is hard". Try writing an (INSERT FRAMEWORK HERE) app outside the browser. People assume that writing an APPLICATION for a browser is easy , which is why people get stuck maintaining monstrosities that are disorganized, not comp…

> you likely won't be writing a complex desktop application without some tooling installed

With C++ I can just download Visual Studio, or the Qt SDK. No other dependencies.

With Go, I download Go (a single installer) and also my Go IDE of choice - LiteIDE (a single zip).

I don't have to install an installer installer or any nonsense like that.

Re: React Tutorial: Cloning Yelp

#224

Earlier quoted context omitted.

That's the first time he prints anything to screen, but the actual first "Hello world" text is at the beginning of the Routing section where he's just finished all initial boilerplate and testing setup and puts in his first route. Which is a little more representative. I think it's a good guide btw.

I guess it depends what one thinks is representative of a hello world. His first print out of the literal "hello world" may be down that far, but in terms of "classical" hello world "standards" (just based off what hello world apps have traditionally looked like), the section I linked is more analogous in my opinion. It shows react operational and rendering. If the bar is a yelp clone (which is already contrary to wh…

My thinking was the bar would be "first output after boilerplate setup", in this case immediately before beginning to write any yelp-ish logic.

Re: React Tutorial: Cloning Yelp

#225

Earlier quoted context omitted.

Grunt is actually not still fine to use. I've been burnt by a lot of plugins coming out for Gulp only and now for webpack only. What the GP says is true: if you start using any of these JS tools prepare to switch them out every 6 months.

> What the GP says is true: if you start using any of these JS tools prepare to switch them out every 6 months. As a full stack JavaScript developer, the tools I used over 6 months ago are also the tools I use today. Only difference is I left Angular for React. But my build tools are still the same. I use Gulp, SASS and Webpack. You're talking out of your ass if you actually believe something can get to the popularit…

I'm with you, but there's a strong point with Grunt vs Gulp. Gulp is the new standard, and it usurped Grunt only how many months ago?

Re: React Tutorial: Cloning Yelp

#226

Earlier quoted context omitted.

> What the GP says is true: if you start using any of these JS tools prepare to switch them out every 6 months. As a full stack JavaScript developer, the tools I used over 6 months ago are also the tools I use today. Only difference is I left Angular for React. But my build tools are still the same. I use Gulp, SASS and Webpack. You're talking out of your ass if you actually believe something can get to the popularit…

I'm with you, but there's a strong point with Grunt vs Gulp. Gulp is the new standard, and it usurped Grunt only how many months ago?

Grunt just released v1.0 and is still a great alternative. People fail to realize just because another way to do something comes out, doesn't mean all of the sudden the previous way is no longer a viable solution.

Re: React Tutorial: Cloning Yelp

#227

Earlier quoted context omitted.

By the same note, you likely won't be writing a complex desktop application without some tooling installed, with similar pre-requisites. I don't know why people get so irritated at "JS tooling is hard". Try writing an (INSERT FRAMEWORK HERE) app outside the browser. People assume that writing an APPLICATION for a browser is easy , which is why people get stuck maintaining monstrosities that are disorganized, not comp…

There is much less tooling and much less churn even for a very complex Java application

When I see people in other teams fighting with Maven, Jenkins builds for weeks somehow I cannot believe this.

Re: React Tutorial: Cloning Yelp

#228

Not React specific, but how do we tackle SEO for a site like Yelp, where SEO is very important? I want to turn an article-based site into a SPA, so it can consume a stateless API and horizontally scale. But I fear it'd lose a lot of pages in Google.

React can render on the server side using the initial app state.

Couple examples: (1) https://github.com/mhart/react-server-example and (2) This article from me: https://medium.com/@firasd/quick-start-tutorial-universal-re... (Previous discussion: https://news.ycombinator.com/item?id=11461159)

Re: React Tutorial: Cloning Yelp

#229
post #181

Earlier quoted context omitted.

>it just doesn't pay off to learn the new, cool thing when it's going to be obsolete in 3 months or less. Does this actually happen? If you had learned Angular way back, you would still be in a comfortable situation. New stuff coming in, but it's compatible with the old stuff. Same with React. Had you learned react when it was talked about, you would have gotten, what, at least 2 years worth of value by now? And a lo…

Grunt is actually not still fine to use. I've been burnt by a lot of plugins coming out for Gulp only and now for webpack only. What the GP says is true: if you start using any of these JS tools prepare to switch them out every 6 months.

Maybe I'm not ahead of the curve enough. Still though, every 6 months? Did you start using Grunt only 6 months before running into this issue?

Maybe I'm reading this too literally, but personally I'm totally cool with using a tool for 2 years and then transitioning to another. 2 years is already a lot of good value.

Re: React Tutorial: Cloning Yelp

#230
Is it me, or does the JS tool ecosystem have the same problems encountered in some functional language frameworks (LISP for example)? I'm not comparing the languages here (I'm not a fan of JS), but how they are lacking the 'Batteries' and toolsets other languages have grown up with. Since you can do practically anything with JS (or LISP), if something is lacking simply write your own solution ... repeated 1,000 times. This is why there seems to be a gazillion tools/solutions/framework each doing something similar but different enough to cause massive confusion to newcomers. This is one of the reasons DART had appealed to me, the language came with a framework and tools that helped you get started right away, instead of getting bogged down trying to figure if you should used Webpack or it's numerous alternatives.
Post reply on HN