|
There are a few services that will handle your angular/ember/whatever poo poo for SEO but you could also just use server-side frameworks sooooo unless your use case requires offline capabilities, I guess.
|
#
¿
Dec 2, 2013 06:57
|
|
|
|
| # ¿ May 2, 2024 12:28 |
|
|
Thanks to all the React noise in this thread I spent Friday figuring it out and implementing it in a new webapp project. It seems really neat so far and I'm excited to see what kind of speed improvements it can bring to some of my other apps.
|
|
#
¿
Mar 29, 2014 18:15
|
|
|
dumb question re: React - I have a page with a big table handled by React that need to be filterable by column. Using React I have methods that listen for filter add/remove events via pub/sub, but I need to have a UI to control adding and removing filters. I want to put the controls for the filters in a pretty distinct page element from the table (a jquery mobile panel, to be specific), so I feel like it would be awkward to expand the scope of the React element to including basically the entire page (I'm using jQuery Mobile for layout and controls). Can anyone offer some advice on how to handle this situation? This is my first time trying to implement React in production and nobody on my team has more experience than I do, but I do have a ton of experience with jquery mobile.
|
|
#
¿
Apr 11, 2014 03:16
|
|
|
Maluco Marinero posted:This is a good blog post to get into component thinking. Basically, the container is a component, and then you drill down to the smallest components, ideally those are reusable to the point the more granular they become, whether it's a widget or whatevs. Yeah that page helped a lot when i was getting going, i guess my faltering point is building the whole JQM page through React. The problem is that the filters need to be multiselects and are not children of the table, but need to have access to the full list of distinct values of the given column. I handled this through janky spaghetti code before but want to make things more modular now but don't know how to without tying everything into a huge (page) block, which is sort of the opposite of modularity as I understand it.
|
|
#
¿
Apr 11, 2014 04:32
|
|
|
Wow, thanks for the effortpost. It does sound like I'll have to make the whole thing a react component, but knowing about setProps() is good. Somehow I missed that one.
|
|
#
¿
Apr 11, 2014 15:19
|
|
|
Okay, buckled down and did the whole page with React, no problems with jQuery Mobile at all and it's really loving easy to modify. 
|
|
#
¿
Apr 12, 2014 16:29
|
|
|
I've about had it trying to get jQuery Mobile and React to play nice with each other. Can anyone suggest a UI framework that handles (nearly) as many mobile device use cases as jQuery Mobile that maybe isn't as opinionated about DOM manipulation and navigation? Looking for your standard web app UI elements like dialogs, touch friendly select menus, menu panels, etc.
|
|
#
¿
Jun 19, 2014 02:04
|
|
|
Corla Plankun posted:Whats the name of the form element that contains selectable items and you can hold shift/ctrl to select more than one? A select menu with "multiple" attribute. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select
|
|
#
¿
Jul 6, 2014 19:53
|
|
|
Ahz posted:What's a fairly simple way to take a form with a number of identical fields say a questionnaire and javascript them into separate pages for the users point of view? Put the 'pages' in separate divs and show/hide them maybe?
|
|
#
¿
Sep 5, 2014 03:41
|
|
|
Ahz posted:Any tips on an easy way to do that? Or the best way to add some type of transitions? Just set up an event liostener for the 'next page button/link' and when it's clicked use jQuery to select the current div and use .hide() or .fadeOut() or .slideUp() to hide it, and select the next div and do the opposite. Quick and dirty example: JavaScript code:HTML code:
|
|
#
¿
Sep 7, 2014 02:58
|
|
|
If you're using the React.createClass notation, it works just fine without binding: https://jsfiddle.net/ah3q4LLd/ If you're using the ES2015 class notation, you can do it a few different ways: binding `this`: https://jsfiddle.net/xuu88rgL/ anonymous functions: https://jsfiddle.net/ha0adqfj/ Or what Lumpy said.
|
|
#
¿
Nov 1, 2015 22:24
|
|
|
I do most everything in Atom these days. VS Code is nice in general but it doesn't really do autocorrect or intellisense or anything for JSX beyond just highlighting syntax.
|
|
#
¿
Nov 30, 2015 02:03
|
|
|
Seconding Mocha with Enzyme. It's super nice.
|
|
#
¿
Dec 17, 2015 02:50
|
|
|
Depressing Box posted:On that note, does anyone have any recommendations for a good, browser-friendly request library? My current project is only using jQuery for $.ajax, and it's modular enough that I could swap it out with anything that returns a promise. Axios if you want promises, and superagent if you want callbacks.
|
|
#
¿
Dec 22, 2015 03:46
|
|
|
Suspicious Dish posted:I really don't understand the new web build process stuff. How do I build a .html file that references my fancy new modules with something like webpack? I'm in the guts of file loaders and html webpack plugins and I really don't understand any of it. I would recommend keeping webpack out of your html. Just use it to build your js and include it in your html with a good old script tag.
|
|
#
¿
May 27, 2016 02:06
|
|
|
Yeah I consider the fact that react is almost completely vanilla JavaScript to be one of its major selling points, especially for a small team like mine.
|
|
#
¿
Jun 15, 2016 05:14
|
|
|
Thermopyle posted:What stage Babel transpilation does it do? Looks like react, es6, es7, and a few other plugins that aren't standards yet: https://github.com/facebookincubator/create-react-app/blob/master/config/babel.prod.js I think their reasoning is that it's simpler to have no config or let you go totally custom at first, rather than trying to anticipate what kinds of customization people might want to add. They're going to continue refining it, though so we may see more presets down the line.
|
|
#
¿
Jul 23, 2016 19:22
|
|
|
Redmark posted:Are decorators on-track for browser support any time soon? I have a hard time not getting confused with which features are in which ES version. They're currently at stage 2 in this process: https://tc39.github.io/process-document/ At stage 4, a feature will be included in the yearly version of the ECMAscript standard.
|
|
#
¿
Dec 7, 2016 02:56
|
|
|
Kekekela posted:Had my first "node on windows" issue in quite a while today. Trying to set NODE_ENV in an npm script but webpack wasn't picking it up. Found a bunch of different suggestions but nothing was working. Finally this little package saved the day: cross-env cross-env is great, and goes well with https://www.npmjs.com/package/npm-run-all if you have scripts that need to do things in parallel across OSes.
|
|
#
¿
Jan 20, 2017 04:53
|
|
|
I like flow over typescript mainly because I can drop it into my React apps (using babel for compiling) as I go along without doing anything other than dropping the //@flow comment into files and installing the node_modules type declarations using flow-typed. VS Code's "Flow Language Support" plugin is great at giving you the in-IDE intellisense goodness. Typescript, however, definitely has an advantage over Flowtype in terms of third-part typedefs.
|
|
#
¿
Apr 17, 2017 03:33
|
|
|
Nolgthorn posted:Just for numbers, I'd do it myself... Please don’t post links to w3schools.
|
|
#
¿
Oct 21, 2017 04:35
|
|
|
Ape Fist posted:As much as I fully understand and actually appreciate the whole thing where you insert this new Angular 2 syntax directly into the HTML template and because it's operating inside of a component it works, i.e. things like ngIf, ngFor, [], and () events I still feel like sitting here going 'You've gone too far this time, google, too far If there is, i'd love to hear it. Javascript already has if blocks and for loops so I've never really understood why all that new syntax was necessary.
|
|
#
¿
Jan 16, 2018 15:01
|
|
' Maybe it's something to do with the idea that I don't like logic bleeding into the HTML the way it does. It's not exactly advanced logic but I dunno, I'm grumbling about absolutely nothing here and there's probably a billion advantages to doing it this way versus something like stuffing a function into the component and calling it.
|
I know that this is not super helpful but this is one of the ways in which material-ui is a bad library and should never be used. You need to mock the theme provider, god help you.
|
|
#
¿
Feb 22, 2018 06:36
|
|
|
Nolgthorn posted:yarn has a lot of the same foundational issues with team structure and politics that npm suffers from. Can you be more specific here?
|
|
#
¿
Feb 23, 2018 18:28
|
|
|
Yeah, we've been using yarn for a while (maybe a year now? I can't remember) and it's been way more reliable than npm. I was kinda wondering if there was some governance issue I wasn't aware of, but I guess not. I try to keep up on those things.
|
|
#
¿
Feb 24, 2018 17:41
|
|
|
smackfu posted:Just curious, how was npm unreliable for you? We really haven’t seen any reliability issues on our team. We had issues with different versions of dependencies getting installed in CI than in development, primarily. This was before npm lockfiles and we weren't using shrinkwrap because I didn't like it as a solution (don't remember why, now).
|
|
#
¿
Feb 28, 2018 03:52
|
|
|
ddiddles posted:You do have to call done() with async tests, but you should get an angry error message if a test times out because of async. That must be gulp, mocha will just say it timed out.
|
|
#
¿
Mar 24, 2018 02:57
|
|
|
poemdexter posted:I think most API's these days return JSON responses regardless of how they store the data behind the scenes. Hell, most relational databases can read, store, query, and return json at this point.
|
|
#
¿
Apr 25, 2018 14:39
|
|
|
Yeah - any path being referenced from your javascript that isn't a reference to something being bundled should be written as if it was from the index.html, because that's where the browser will be looking for it.
|
|
#
¿
Jun 3, 2018 14:26
|
|
|
Azure’s GitHub integration is nice until you want to integrate real CI tools into your development process. Then you’re stuck with azure cli basically, where they will randomly decide that they don’t need to support all of azure’s features, like function app slots, and deploys will just randomly fail for no apparent reason.
|
|
#
¿
Jun 26, 2018 15:07
|
|
|
Why can’t you reference them as images and host them separately? It seems crazy to me to bundle them into your app at all.
|
|
#
¿
Aug 2, 2018 15:27
|
|
|
The Fool posted:I feel like this is wrong, but lack the wherewithal to provide a counter argument. Express isn't terribly efficient at serving static files, but the difference in performance is likely not important unless you have a shitload of traffic.
|
|
#
¿
Aug 21, 2018 01:49
|
|
|
my bony fealty posted:Someone told me once that doing @import React, { Component, Fragment } from 'react' is bad and just using React.Component and React.Fragment is better is this true? Does it matter? I guess it is redundant to import them directly? you can write import React, {Component} from 'react' right now because babel incorrectly interprets the finalized es module spec; it's not valid javascript. The correct thing to do, which will not break when you stop using babel to compile to modern javascript, is to import React and then use React.Component.
|
|
#
¿
Sep 7, 2018 02:29
|
|
|
Snapshots are useless and generally I have unit tests surrounding basic components verifying they work, and then i just unit test rendering the other components by shallow rendering and asserting that no error is thrown. Maybe more deep tests are useful with really complex UI, but I find that spending time on unit tests on business logic (in my redux action creators and thunks) is a better use of my time than creating elaborate and exhaustive assertions about UI components. This also obviously only works if you've taken care to separate business logic from your UI, which you should be doing anyway.
|
|
#
¿
Oct 19, 2018 23:42
|
|
|
Lumpy posted:My bigass app is still React 15.x React codemods are your friend.
|
|
#
¿
Oct 29, 2018 15:13
|
|
"Upgrade to 16" is that thing at the bottom of the backlog that keeps getting buried by the endless new stuff.
|
my bony fealty posted:yeah, I try to use context and functional components a lot these days too so I'm hoping it won't be too bad to start hookin stuff at least. Tho context may be useless there. Sharp is generic (and easy to use). Maybe describe what you want to accomplish?
|
|
#
¿
Nov 7, 2018 15:43
|
|
|
my bony fealty posted:Generate an srcset of optimized images that doesn't rely on a SaaS pretty much. Playing with Sharp looks to be the way to go, gonna see if it can be integrated into a graphql resolver that gets an image from another REST api. That sounds like a good plan!
|
|
#
¿
Nov 9, 2018 03:20
|
|
|
Yarn has update checking - `yarn upgrade-interactive`
|
|
#
¿
Nov 11, 2018 18:06
|
|
|
I really only test thunks and reducers. But I also have a really small team with a lot of stuff to support so I have to focus our efforts where they are most useful.
|
|
#
¿
Feb 22, 2019 04:25
|
|
|
|
| # ¿ May 2, 2024 12:28 |
|
|
Ape Fist posted:So instances/roles like this are where actually having a very very very firm grasp of basic JS is extremely loving useful beause, if you're lucky, you MIGHT get to argue to have at least a basic gulp compiler to transpile your SCSS/ES6. Direct DOM manipulation using JS is a fairly normal part of my every day life but at least I _tend_ to be able to do it through ES6 where I at least have access to template strings and semi-coherent OO design principles which I prefer to use given that I adore TypeScript. So basically you're doing direct dom manipulation because your job won't let you use a library.
|
|
#
¿
Mar 25, 2019 14:36
|
|