Modern front-end development: skinny jeans and handlebar mustaches ITT

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Modern front-end development: skinny jeans and handlebar mustaches ITT

«‹›235 »

HaB: Jan 5, 2001; What are the odds?

Grump posted:

One time I sent this company a link to my github and they said:

"What is this?"

Yikes.

Thermopyle posted:

I dont think I'd want to work for that company.

Yeah that problem seems to have solved itself.

# ? Aug 19, 2017 13:53

Adbot: ADBOT LOVES YOU

# ? Jun 4, 2024 22:19

prom candy: Dec 16, 2005; Only I may dance

Have you guys hosed around with next.js at all? It seems like it might be closer to what I need for some content-heavy sites vs. Gatsby. As far as I can tell Gatsby is no good if you need to do stuff like define a route for /pages/:slug and then fetch a page from some API based on :slug and server-render its title, OpenGraph tags, and content, right?

Gatsby seems like it would be good for utilities that aren't concerned with SEO, or for content sites where the content at build time remains the content, but for something like a blog with a Wordpress back-end that I hand off to a client it's not going to scratch the itch, right?

# ? Aug 20, 2017 17:40

Maluco Marinero: Jan 18, 2001; Damn that's a
fine elephant.

Not necessarily. A lot of content sites would actually benefit from every admin action kicking off the generation of a static page, so serving the majority of pages only involves the thing web servers are best at, serving cached static files. It's more an issue of wiring it up I imagine. Wordpress is better served by purpose built stuff like WP Supercache (which functionally works the same way if you set it up right). Hooking up Gatsby would involve more effort.

# ? Aug 21, 2017 05:44

IAmKale: Jun 7, 2007; やらないか; Fun Shoe

Is there a way to get Webpack to print out to console which file it's currently chewing through? Our app's build times is just absolute poo poo on Windows, and of course our bank client is building the app on Windows so the 20 minute build times for the dev version of the site is ridiculous. To compare, the dev version builds in about two minutes on OSX.

While investigating this issue I've noticed that the build process always slows to a crawl at around "64% 3576/3942 build modules". The next hundred files/modules/whatever (I'm not actually sure if the "3942" is a file count, or some other arbitrary "build module" that can contain multiple files) tick off very slowly, until it picks up some more velocity and finishes the build several minutes later. Unfortunately, I have no way of telling which files might be causing the bottleneck.

What kinds of options do I have for diagnosing the long build times on Windows?

# ? Aug 21, 2017 20:41

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

IAmKale posted:

Is there a way to get Webpack to print out to console which file it's currently chewing through? Our app's build times is just absolute poo poo on Windows, and of course our bank client is building the app on Windows so the 20 minute build times for the dev version of the site is ridiculous. To compare, the dev version builds in about two minutes on OSX.

While investigating this issue I've noticed that the build process always slows to a crawl at around "64% 3576/3942 build modules". The next hundred files/modules/whatever (I'm not actually sure if the "3942" is a file count, or some other arbitrary "build module" that can contain multiple files) tick off very slowly, until it picks up some more velocity and finishes the build several minutes later. Unfortunately, I have no way of telling which files might be causing the bottleneck.

What kinds of options do I have for diagnosing the long build times on Windows?

Have you tried this with a RAMDisk of some sort?

# ? Aug 21, 2017 20:43

The Fool: Oct 16, 2003

https://webpack.github.io/docs/cli.html

Check out --profile and the display options.

# ? Aug 21, 2017 20:45

Rubellavator: Aug 16, 2007

HaB posted:

That sounds vaguely similar to a ui-grid problem I had where the grid would just show up blank. Turned out to be something similar, and the fix was forcing a window.resize event so it would then recompute all its container sizes properly.

I believe this may be the SO answer I ended up grabbing a solution from, but it was several months ago:

https://stackoverflow.com/questions/37485045/angular-ui-grid-does-not-show-content-unless-browser-window-is-resized

I owe you a beer dude

# ? Aug 23, 2017 20:43

HaB: Jan 5, 2001; What are the odds?

Rubellavator posted:

I owe you a beer dude

Sweet. Yeah glad to be able to pay that one forward, since whoever solved on SO saved my bacon as well.

# ? Aug 24, 2017 12:21

Pollyanna: Mar 5, 2005; Milk's on them.

How do you verify higher order/chained functions in Sinon+Enzyme? I have function f which takes functions g and h, and I need to verify that f performs g(h()). I tried making g and h spies, and checking `g.calledOn(h)` and `g.calledWith(h)`, but neither seem to work.

Edit: I am diving further into unit testing Redux containers with Sinon+Enzyme and wow unit testing front-end stuff is some dire poo poo. :negative:

Pollyanna fucked around with this message at 17:49 on Aug 31, 2017

# ? Aug 31, 2017 15:22

Nolgthorn: Jan 30, 2001; The pendulum of the mind alternates between sense and nonsense

Hello fellow coding hipsters.

It has finally happened. I am using a component based framework called Vue willingly, not just because I have to use such a thing for work either. I started developing as I always do in my naked development environment using Typescript and nothing. But this time I was building a true single page app powered by Websockets and I couldn't get my head wrapped around not reloading the page for logged in/logged out state.

You win, components. You win. Can I apply for the handlebar moustache here, what kind of delivery time are we looking at?

# ? Sep 8, 2017 19:06

Nolgthorn: Jan 30, 2001; The pendulum of the mind alternates between sense and nonsense

Pollyanna posted:

How do you verify higher order/chained functions in Sinon+Enzyme? I have function f which takes functions g and h, and I need to verify that f performs g(h()). I tried making g and h spies, and checking `g.calledOn(h)` and `g.calledWith(h)`, but neither seem to work.

Edit: I am diving further into unit testing Redux containers with Sinon+Enzyme and wow unit testing front-end stuff is some dire poo poo.

It is likely to me that h() is returning a generated object, or something like that which does not === your real test result. Although the data within might be identical between the objects the reference is different.

# ? Sep 8, 2017 19:12

Nolgthorn: Jan 30, 2001; The pendulum of the mind alternates between sense and nonsense

Love Stole the Day posted:

Can anyone show me an example or two of what a portfolio looks like for applying to front end jobs? Because job searching is like a black hole: resume goes in, nothing comes out.

I've had success with a paragraph long comma separated list of technologies and things I know. Followed by a short thing explaining how much professional experience I have. Followed by standard resume fare like jobs and for each listing what I learned.

Proving that I'm not a barely functional autist in the interview is where it falls apart.

# ? Sep 8, 2017 19:20

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

Nolgthorn posted:

Hello fellow coding hipsters.

It has finally happened. I am using a component based framework called Vue willingly, not just because I have to use such a thing for work either. I started developing as I always do in my naked development environment using Typescript and nothing. But this time I was building a true single page app powered by Websockets and I couldn't get my head wrapped around not reloading the page for logged in/logged out state.

You win, components. You win. Can I apply for the handlebar moustache here, what kind of delivery time are we looking at?

one of us! one of us! one of us!

We tried shipping you your moustache, but the web app keeps saying cannot read property 'length' of undefined :smith:

# ? Sep 10, 2017 21:29

Uziel: Jun 28, 2004; Ask me about losing 200lbs, and becoming the Viking God of W&W.

I'm stumped by CORS.

I'm consuming a vendor's API. I can get it to work just fine in Postman, Fiddler, etc.

When posting to the API to get my token, I get CORS errors. I have no control over the API/server end.
What should I do differently?!

code:

function getToken() {
            $.ajax({
                url: "tokenURLwithclientid/etc",
                type: 'POST',
                headers: {
                   "Access-Control-Allow-Origin": "*", 
                   // "Access-Control-Allow-Headers" : "Origin, X-Requested-With, Content-Type, Accept, Authorization,Access-Control-Allow-Origin",
                    //"Access-Control-Allow-Methods" : "GET,OPTIONS,POST"
                },
                error: function (err) {
                    console.log('Error!', err)
                },
                success: function (data) {
                    console.log('Success!');
                    console.log(data);
                    //localStorage.setItem('token', data.id_token);
                }
            });
        }

# ? Sep 15, 2017 20:13

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

Uziel posted:

code:

function getToken() {
            $.ajax({
                url: "tokenURLwithclientid/etc",
                type: 'POST',
                headers: {
                   "Access-Control-Allow-Origin": "*", 
                },
                error: function (err) {
                    console.log('Error!', err)
                },
                success: function (data) {
                    console.log('Success!');
                    console.log(data);
                    //localStorage.setItem('token', data.id_token);
                }
            });
        }

Are you sure their API allows cross-origin access? The Access-Control-Allow-Origin bit is a server thing, not something you should be doing.

You may want to add:

JavaScript code:

xhrFields: {
    withCredentials: false
}

to your jQuery thing, as that can help, but if the API is using cookies for session auth, it will break it.

Lumpy fucked around with this message at 20:43 on Sep 15, 2017

# ? Sep 15, 2017 20:41

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

Uziel posted:

I'm stumped by CORS.

I'm consuming a vendor's API. I can get it to work just fine in Postman, Fiddler, etc.

When posting to the API to get my token, I get CORS errors. I have no control over the API/server end.
What should I do differently?!

If the backend does not support CORS, there isn't much you can do in the client to get around that. CORS is something where the browser politely knocks, asks if it may send a request, and if the server says no, the browser won't try. Postman doesn't bother knocking and just barges in, and the client then responds with what is asked for.

If you need to get around this, you could use something like nginx or some other forwarding tool, where you implement an API on your end that DOES support CORS, and then it simply makes the request for you. But, this involves setting up a backend service for your client, which maybe you can't actually do.

Skandranon fucked around with this message at 00:04 on Sep 16, 2017

# ? Sep 16, 2017 00:02

prom candy: Dec 16, 2005; Only I may dance

Couple of TypeScript + React questions from a TypeScript noob:

1. Say I have a component called Button. Is there any reason I would name my props and state interfaces ButtonProps and ButtonState instead of just Props and State? The interfaces are local to the file unless I export them, no? All the examples I see seem to use ButtonProps and ButtonState, is that to help the reader understand what's going on or is that how I should be writing my code?

2. Say my Button component is also a connected redux component. What I've been doing so far is this:

code:

interface ConnectedState { // ... state that I'll pull out of Redux };
interface ConnectedActions { // ... bound actions from Redux };
interface ButtonProps extends ConnectedState, ConnectedActions { // any props that don't come from Redux };

const Button = (props: ButtonProps) => <img src="file://C:\Users\Dad\Pictures\hello.jpg" />;

export default connect<ConnectedState, ConnectedActions, void>(mapStateToProps, mapDispatchToProps)(Button)

Is that about right? Or not even close?

# ? Sep 16, 2017 16:27

ModeSix: Mar 14, 2009

prom candy posted:

Couple of TypeScript + React questions from a TypeScript noob:

1. Say I have a component called Button. Is there any reason I would name my props and state interfaces ButtonProps and ButtonState instead of just Props and State? The interfaces are local to the file unless I export them, no? All the examples I see seem to use ButtonProps and ButtonState, is that to help the reader understand what's going on or is that how I should be writing my code?

2. Say my Button component is also a connected redux component. What I've been doing so far is this:
code:
interface ConnectedState { // ... state that I'll pull out of Redux };
interface ConnectedActions { // ... bound actions from Redux };
interface ButtonProps extends ConnectedState, ConnectedActions { // any props that don't come from Redux };

const Button = (props: ButtonProps) => <img src="file://C:\Users\Dad\Pictures\hello.jpg" />;

export default connect<ConnectedState, ConnectedActions, void>(mapStateToProps, mapDispatchToProps)(Button)
Is that about right? Or not even close?

I'm not really sure, but my question is why are you using Typescript with React? They created a whole new superset of javascript for it called JSX which is similar to Typescript and what React uses natively. It seems like you're adding unnecessary complexity by trying to shoehorn in TS.

In JSX what you're asking would be something like this:

code:

import React from 'react'
import { connect }  from 'react-redux';
import * as actions from './actions';

class MyClass extends React.Component {
	state = { buttonState: '<img src="file://C:\Users\Dad\Pictures\hello.jpg" />'  }; 
 		this won't actually work because of the double quotes
		and then you could access it via {this.state.buttonProps}

	render() {
		return (
		   Blah blah whatever you're rendering to screen goes here
		)
	}
}

function mapStateToProps({ reducerName1, reducerName2 }) {
	const { propname1, propname2, etc } = reducerName1;\
	const { propnameA } = reducerName2
	return { propname1, propname2, propNameA };
}

export default connect(mapStateToProps, actions)(MyClass);

But again, why are you trying to use Typescript with React? It just seems like you're trying to punch yourself in the balls repeatedly when you could be having your balls rubbed nicely with JSX.

ModeSix fucked around with this message at 18:46 on Sep 16, 2017

# ? Sep 16, 2017 18:25

Uziel: Jun 28, 2004; Ask me about losing 200lbs, and becoming the Viking God of W&W.

Lumpy posted:

Are you sure their API allows cross-origin access? The Access-Control-Allow-Origin bit is a server thing, not something you should be doing.

You may want to add:
JavaScript code:
xhrFields: {
    withCredentials: false
}
to your jQuery thing, as that can help, but if the API is using cookies for session auth, it will break it.

Thanks, I'm going to ask them if they allow that.

Skandranon posted:

If the backend does not support CORS, there isn't much you can do in the client to get around that. CORS is something where the browser politely knocks, asks if it may send a request, and if the server says no, the browser won't try. Postman doesn't bother knocking and just barges in, and the client then responds with what is asked for.

If you need to get around this, you could use something like nginx or some other forwarding tool, where you implement an API on your end that DOES support CORS, and then it simply makes the request for you. But, this involves setting up a backend service for your client, which maybe you can't actually do.

That's likely what I'll end up doing (and I already have server side code that communicates with their API).

# ? Sep 16, 2017 18:40

reversefungi: Nov 27, 2003; Master of the high hat!

ModeSix posted:

I'm not really sure, but my question is why are you using Typescript with React? They created a whole new superset of javascript for it called JSX which is similar to Typescript and what React uses natively. It seems like you're adding unnecessary complexity by trying to shoehorn in TS.

Uh, JSX and TypeScript aren't mutually exclusive. You can use TypeScript with React to avoid having to use Prop Types and instead defer type checking to the TypeScript compiler instead. Which is nice because you can also get feedback from your editor if they have good TypeScript support (*cough* VS Code *cough*).

# ? Sep 16, 2017 18:40

ModeSix: Mar 14, 2009

The Dark Wind posted:

Uh, JSX and TypeScript aren't mutually exclusive. You can use TypeScript with React to avoid having to use Prop Types and instead defer type checking to the TypeScript compiler instead. Which is nice because you can also get feedback from your editor if they have good TypeScript support (*cough* VS Code *cough*).

I'm not saying it's not possible, but it makes it far more complicated to write React since the whole React library/3rd party libraries are written to be consumed using JSX and almost all documentation he will find will be written with JSX in mind.

It's the hard way? I mean he did specifically say he's a TS noob, so I assume also a React noob, so why overcomplicate things in a language you're not familiar with in a library/framework you're not familiar with?

ModeSix fucked around with this message at 18:54 on Sep 16, 2017

# ? Sep 16, 2017 18:49

lunar detritus: May 6, 2009

Why would it be a problem to use JSX in TypeScript? You can use both without any problems.

# ? Sep 16, 2017 18:54

prom candy: Dec 16, 2005; Only I may dance

I'm not a React noob and I am using JSX. Sorry if it wasn't clear, I'm looking for specific answers about using TS with my React/Redux stack, but I'm very comfortable using React/Redux on with regular JS. Imagine my empty components there had a bunch of normal React poo poo in them.

# ? Sep 16, 2017 19:10

Thermopyle: Jul 1, 2003; ...the stupid are cocksure while the intelligent are full of doubt. �Bertrand Russell

JSX and TypeScript do not have anything to do with one another. They do not have overlapping feature sets. Using one should have no effect on your decision to use or not use the other.

TypeScript brings static typing to JS. JSX is a convenient markup or templating language.

# ? Sep 16, 2017 19:16

reversefungi: Nov 27, 2003; Master of the high hat!

ModeSix posted:

since the whole React library/3rd party libraries are written to be consumed using JSX and almost all documentation he will find will be written with JSX in mind.

You can continue to use JSX without a problem if you're using TypeScript.

If you use create-react-app and include the TypeScript settings, you get this as your boilerplate starter code:

JavaScript code:

class App extends React.Component {
  render() {
    return (
      <div className="App">
        <div className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h2>Welcome to React</h2>
        </div>
        <p className="App-intro">
          To get started, edit <code>src/App.tsx</code> and save to reload.
        </p>
      </div>
    );
  }
}

It's almost exactly the same as the standard boilerplate. But now you can include types! You can still use all your external libraries and use JSX as well. The real challenge isn't in writing but in getting all your compile settings/webpack/etc. properly set up and flowing if you're not using create-react-app.

# ? Sep 16, 2017 19:20

prom candy: Dec 16, 2005; Only I may dance

Okay now that that insane misunderstanding is out of the way, can anyone weigh in on my question about proper interface naming and whether my system for setting interfaces for the connect function is sensible?

# ? Sep 16, 2017 20:00

luchadornado: Oct 7, 2004; A boombox is not a toy!

prom candy posted:

Okay now that that insane misunderstanding is out of the way, can anyone weigh in on my question about proper interface naming and whether my system for setting interfaces for the connect function is sensible?

1. Uncle Bob says names should convey context and not include any gratuitous context. If you're building your components correctly, you should never have multiple states/props/etc. So just call them 'state', 'props', and so on since you already know you're within the context of a Button component and you don't need to add that gratuitous context.

2. That looks fine what you're doing, for the future just keep in mind that Typescript shouldn't have an impact on how you write your code. Typescript's greatest benefit is enforcing contracts between functions, so as long as you're getting that and not making it difficult to understand your code, you're using it right. It's also more intuitive when you're using redux-react to have connector components, if you want to look into that.

And yes, React + Typescript are awesome together. The most common headache you should run into is getting Typescript and Immutable.js to play nicely. There are multiple options for handling this though - my favorite is not using Immutable.

# ? Sep 16, 2017 20:11

ModeSix: Mar 14, 2009

The Dark Wind posted:

You can continue to use JSX without a problem if you're using TypeScript.

If you use create-react-app and include the TypeScript settings, you get this as your boilerplate starter code:
JavaScript code:
class App extends React.Component {
  render() {
    return (
      <div className="App">
        <div className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h2>Welcome to React</h2>
        </div>
        <p className="App-intro">
          To get started, edit <code>src/App.tsx</code> and save to reload.
        </p>
      </div>
    );
  }
}
It's almost exactly the same as the standard boilerplate. But now you can include types! You can still use all your external libraries and use JSX as well. The real challenge isn't in writing but in getting all your compile settings/webpack/etc. properly set up and flowing if you're not using create-react-app.

Ok cool. I learned something new! Thanks thread!

# ? Sep 16, 2017 21:07

FateFree: Nov 14, 2003

So Vue. Its nice. I find myself getting stuck in the component mentality when trying to utilize UI frameworks. I've been used to Bootstrap but that relies on JQuery so I've looked at all the pretty vue UI frameworks like Vuetify, Element, Quasar etc. It really seems like a barrier to entry that every framework has its own set of components that I need to learn an API for, and customizing things becomes much more of a hassle. Maybe I'm going about this wrong. In the prototyping phase, should I just pick a regular, non-vue framework and make my own set of components just for quicker development? And then maybe swap out the guts when I'm ready to make it nice? The only problem is now I feel like I'm creating a whole set of components like buttons and alerts blah blah.

It seems tricky to customize and prototype at the same time. Now I'm going back and forth with which UI framework to stick with, since it seems like such a commitment to have to learn everything. Maybe I should base everything off a regular CSS framework like Material Lite, and make my own components out of that? I'd appreciate any guidance.

# ? Sep 16, 2017 21:47

reversefungi: Nov 27, 2003; Master of the high hat!

FateFree posted:

So Vue. Its nice. I find myself getting stuck in the component mentality when trying to utilize UI frameworks. I've been used to Bootstrap but that relies on JQuery so I've looked at all the pretty vue UI frameworks like Vuetify, Element, Quasar etc. It really seems like a barrier to entry that every framework has its own set of components that I need to learn an API for, and customizing things becomes much more of a hassle. Maybe I'm going about this wrong. In the prototyping phase, should I just pick a regular, non-vue framework and make my own set of components just for quicker development? And then maybe swap out the guts when I'm ready to make it nice? The only problem is now I feel like I'm creating a whole set of components like buttons and alerts blah blah.

It seems tricky to customize and prototype at the same time. Now I'm going back and forth with which UI framework to stick with, since it seems like such a commitment to have to learn everything. Maybe I should base everything off a regular CSS framework like Material Lite, and make my own components out of that? I'd appreciate any guidance.

I know that for React, there are libraries like react-bootstrap and reactstrap that allow you to use bootstrap components (ie <Modal />) and I found it super easy to transition to using them from vanilla bootstrap. Vue seems to have the same thing, judging by a quick google search? AFAIK they should be built so that jQuery is not a dependency. Maybe you can check those out and see if they fit your use case, save yourself the hassle of learning a new framework.

# ? Sep 16, 2017 22:30

FateFree: Nov 14, 2003

Thanks, I'm giving bootstrap-vue js a try and it seems close enough and documented well enough to not cause too much of a barrier.

On another note, my one final barrier is I'm trying to set a fixed width sidebar on a bootstrap example found here: https://getbootstrap.com/docs/4.0/examples/dashboard/

I know bootstraps grids are not meant to have set widths, but for my application it makes more sense. Is there a painless way to change this example to having a fixed width sidebar of something like 300px, as well as keeping it unscrolled like it is here? I tried changing max,min width but it messes up the other content when the browser is resized.

Edit - Actually I just found a great blog post with exactly what I needed: https://www.atlascode.com/blog/bootstrap-fixed-width-sidebars/

FateFree fucked around with this message at 18:36 on Sep 17, 2017

# ? Sep 17, 2017 18:18

The Merkinman: Apr 22, 2007; I sell only quality merkins. What is a merkin you ask? Why, it's a wig for your genitals!

Has anyone read this article comparing Angular, React, and Vue? For those familiar with those frameworks, what are your thoughts?
https://medium.com/unicorn-supplies/angular-vs-react-vs-vue-a-2017-comparison-c5c52d620176

# ? Sep 21, 2017 01:23

Love Stole the Day: Nov 4, 2012; Please give me free quality professional advice so I can be a baby about it and insult you

The Merkinman posted:

Has anyone read this article comparing Angular, React, and Vue? For those familiar with those frameworks, what are your thoughts?
https://medium.com/unicorn-supplies/angular-vs-react-vs-vue-a-2017-comparison-c5c52d620176

I feel like there's a huge disconnect between what the blogs tell me employers want and what the actual job advertisements I see everywhere tell me employers want

# ? Sep 21, 2017 02:38

Count Thrashula: Jun 1, 2003; Death is nothing compared to vindication.; Buglord

Love Stole the Day posted:

I feel like there's a huge disconnect between what the blogs tell me employers want and what the actual job advertisements I see everywhere tell me employers want

And what are those job ads telling you?

I've been out of the market for a while so I'm genuinely curious

# ? Sep 21, 2017 14:21

Love Stole the Day: Nov 4, 2012; Please give me free quality professional advice so I can be a baby about it and insult you

COOL CORN posted:

And what are those job ads telling you?

I've been out of the market for a while so I'm genuinely curious

https://forums.somethingawful.com/showthread.php?threadid=3571035&userid=192696#post473611103

# ? Sep 21, 2017 16:20

luchadornado: Oct 7, 2004; A boombox is not a toy!

Love Stole the Day posted:

I feel like there's a huge disconnect between what the blogs tell me employers want and what the actual job advertisements I see everywhere tell me employers want

The blogs talk about fun new technologies, and cool places to work try to use some of them. On the flip side, there are a lot of places that just need a new cog for the machine to fix some legacy code and not rock the boat. If you're talking about programming on an Internet forum regularly, the former probably looks more attractive. Although there's nothing wrong with just wanting to find a place to put in your 9-5 and not worry about becoming a software craftsman. Everyone has different needs and desires.

# ? Sep 21, 2017 23:40

Love Stole the Day: Nov 4, 2012; Please give me free quality professional advice so I can be a baby about it and insult you

Helicity posted:

On the flip side, there are a lot of places that just need a new cog for the machine to fix some legacy code and not rock the boat.

I want to find and apply to those job advertisements because it sounds like the easiest way to get that legendary "experience" thing I keep reading about. How do I distinguish those advertisements as opposed to the others?

# ? Sep 22, 2017 00:20

Nolgthorn: Jan 30, 2001; The pendulum of the mind alternates between sense and nonsense

The Merkinman posted:

Has anyone read this article comparing Angular, React, and Vue? For those familiar with those frameworks, what are your thoughts?
https://medium.com/unicorn-supplies/angular-vs-react-vs-vue-a-2017-comparison-c5c52d620176

Vue is newer than React and has a lot of neat things to offer. I like its template syntax, I like that I don't have to use jsx, although if I did want to use jsx it is not super easy to do it. My experience with React/Redux has been that Redux is a nightmare. Facebook seems to have acknowledged this in the form of Immutable.js which is a horrendous library and rather than making the situation better, just pollutes a code base irreprably.

Vue has a sweet "reactive" store available as an extension which is by comparison an absolute pleasure to use. However, nothing is tying you to Redux in React, it has a Vue-similar library you can use instead.

I've not used Angular. But it uses Typescript which is awesome.

# ? Sep 23, 2017 17:53

Nolgthorn: Jan 30, 2001; The pendulum of the mind alternates between sense and nonsense

I have a nitpick about Vue though. In my components I have to assign them a name.

code:

export default {
    name: 'my-component'
};

And then when I want to use it I use that name.

code:

<div>
    <my-component />
    <my-component />
    <my-component />
</div>

But for that to work I have to import the file and specify it in the parent component.

code:

import MyComponent from './MyComponent';

export default {
    name: 'my-parent-component',
    components: { MyComponent }
}

I don't like how the import has a different name, slightly, than the actual name of the component. Within the parent component I don't know exactly what the name of my child component is. Furthermore, why is `components` an object? Why is the key `MyComponent`?

It feels like I shouldn't need to define a name in the component. And it feels like I should be able to use it in my parent component like so.

code:

import MyComponent from './MyComponent';

export default {
    name: 'my-parent-component',
    components: {
        'my-component': MyComponent
    }
}

# ? Sep 23, 2017 18:14

Adbot: ADBOT LOVES YOU

# ? Jun 4, 2024 22:19

Thermopyle: Jul 1, 2003; ...the stupid are cocksure while the intelligent are full of doubt. �Bertrand Russell

Nolgthorn posted:

Vue is newer than React and has a lot of neat things to offer. I like its template syntax, I like that I don't have to use jsx, although if I did want to use jsx it is not super easy to do it. My experience with React/Redux has been that Redux is a nightmare. Facebook seems to have acknowledged this in the form of Immutable.js which is a horrendous library and rather than making the situation better, just pollutes a code base irreprably.

Vue has a sweet "reactive" store available as an extension which is by comparison an absolute pleasure to use. However, nothing is tying you to Redux in React, it has a Vue-similar library you can use instead.

I've not used Angular. But it uses Typescript which is awesome.

Immutable.js came way before redux and redux doesn't have anything to do with Facebook except for the fact that the guy who created it was hired by FB long after he released it.

Also, redux is awesome.

# ? Sep 23, 2017 19:17

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Modern front-end development: skinny jeans and handlebar mustaches ITT

«‹›235 »