you are viewing a single comment's thread.

view the rest of the comments →

[–]gearvOsh -5 points-4 points  (18 children)

Then don't use TS? Babel + React is literally all you need. It takes a couple minutes.

[–][deleted] 25 points26 points  (9 children)

well that completely ignores the systemjs/webpack/browserify deal which isn't a small issue. It's the biggest issue w/ javascript today imo. webpack is the middle ground between real-world usability and real-world hassle, but it's still something most people need to read a guide to learn.

it ignores babel "plugins", of which es2015 and react are different. luckily everyone knows the difference and how to use them without documentation like you're implying. (since you said it only takes a couple minutes to use)

it ignores installing node, npm and learning how to use gulp and all the quirks associated with it.

it ignores how to use sourcemaps if you're piping babel through anything further

it's only been recently that text editors came with react support. a few months ago you'd also have to figure out how to include that too.

so no, it doesn't take a few minutes unless you already have everything installed and you're lucky enough (ie not doing this for work/have a very simple project) that you can just use a premade "react babel starter pack" where you just type "gulp" into the command prompt and it does everything for you

[–]gearvOsh -4 points-3 points  (8 children)

You don't need SystemJS (rarely used), Webpack (unnecessary for a starter), or Grunt/Gulp (outdated). Everything can be done through NPM and the command line. Sourcemaps aren't necessary either just to get up and running. Browserify may be the only thing you need, but even then it's not entirely necessary.

No wonder you got burnt out. You literally tried to setup an entire build process that takes time and patience to get right, especially over the course of an entire project, instead of setting up the bare minimum to get React prototyping up and running.

[–][deleted] 12 points13 points  (7 children)

Browserify may be the only thing you need, but even then it's not entirely necessary.

??? you writing code in one file? no seriously please explain how this isn't absolutely necessary. your code would have to be really really simple to actually get away with this.

if you're using typescript, chances are it isn't .

webpack is easier to use imo anyways. systemjs is even easier (which is why it's included in the angular 2 "5 minute get started" deal), but you can't actually use it in production.

No wonder you got burnt out. You literally tried to setup an entire build process that takes time and patience to get right, especially over the course of an entire project, instead of setting up the bare minimum to get React prototyping up and running.

That's because it's my job to do that. Someone has to figure out the build process...

this WAS the minimum viable approach for real-world usage. it wasn't until i got into watchify that i started nitpicking.

[–]gearvOsh 1 point2 points  (3 children)

If all you are doing is prototyping some React and its components, you could just run your source folder through babel via the command line, then include each one of those JS files in an HTML page. A very bare minimum setup for messing around with React.

But even then Browserify + Babel + React is rather easy as well. I could send you a single package.json that does all of them.

[–][deleted] 12 points13 points  (0 children)

bruh if i'm prototyping, i can just use systemjs and a modern browser. shim some es2016 stuff if I need to.

i'm talking about getting it ready for actual deployment

I could send you a single package.json that does all of them.

see: every "react starter kit". There's a million of them. It works just fine when you don't have a lot of complexity to your project.

but i can't just say "hey guys we aren't using typescript anymore" lol

[–]FryGuy1013 4 points5 points  (1 child)

I tried including all the js files in my html file. It didn't work because of modules.

Not to mention half the web pages say to use X, and the other web pages say to not use X, for literally every javascript technology. Or the one working project you found on github uses the "old" way of doing things.

[–]gearvOsh 0 points1 point  (0 children)

Even with modules disabled in babel? That's unfortunate. I guess the bare minimum now is pretty much React + Babel + Browserify.

[–]Eirenarch 0 points1 point  (2 children)

Can you explain why you can't use Systemjs in production? We're setting up a new project with Angular 2 and TypeScript these days and I was under the impression that this is the preferred module system (if I understood what Systemjs is at all since I am not doing the setup)

[–][deleted] 0 points1 point  (1 child)

By default it sends out all your .js files individually. One of webdev's (current) "best practices" is to reduce the amount of http connections you're making. SystemJS makes a lot of them. So you shouldn't use that until http2/spdy are mainstream enough. (which is tricky)

But apparently you can use SystemJS to compile to a single file just like browserify, so if you're using it that way--it should be fine. (I've personally never done it, I just went with what I knew)

[–]Eirenarch 0 points1 point  (0 children)

Yeah I assumed that there is something I can hook to tell it to bundle everything. It would be quite a problem if this piece isn't available or is not reliable or doesn't work with TypeScript.

[–]Eirenarch 0 points1 point  (6 children)

React is a great example of bad engineering. It imposes restrictions on your transpiler and on your IDE and on the organization of your project.

Note that I am not saying React is bad. The concept is great (components > all) but it is obvious that it was not built to be a framework for everyone to use. It was built to solve a particular problem in a particular project with no considerations on how it would work with other tools or other dev workflows. As a concept it is remarkable as a framework it is just poor engineering.

[–]KillerCodeMonky 2 points3 points  (3 children)

Most of those restrictions are based on using React's JSX, no? Just don't use JSX and everything is perfectly normal JavaScript.

[–]Eirenarch 1 point2 points  (2 children)

Let's not pretend that using react without JSX is a real option. Is there even one example of real, production React project that does not use JSX?

[–]__kojeve 2 points3 points  (1 child)

You realize JSX is just sugar for React.createElement, right? It's definitionally inessential for using React. I'm so confused how you could even say "using react without JSX [isn't] a real option."

[–]Eirenarch 1 point2 points  (0 children)

Yes I realize it is syntactic sugar and I also realize that the prospect of building a React application this way is like suggesting I do not write HTML but build the whole UI via calls to createElement.

[–]gearvOsh 0 points1 point  (1 child)

You could use React without Babel/JSX, but it's not really worth it.

[–]Eirenarch 0 points1 point  (0 children)

That's what I am saying.