|
geeves posted:I made a change last night and forgot to edit it in. Awww, yes. That does it, and I can add a slightly transparent color for the style. Thank you. I think all I need to worry about there is "seen". Not sure what seen1 or 2 is. Code: code:
|
# ? Jul 13, 2017 16:54 |
|
|
# ? Jun 5, 2024 08:27 |
|
Roadie posted:It sounds like you've got two different versions of npm 5.0.x. They're still fiddling with the fine details of the package-lock.json format. That was it! Much better now, thanks.
|
# ? Jul 13, 2017 21:47 |
|
For React, where is the balance in terms of deciding if HTML should go in a component.js file or in an html file?
|
# ? Jul 15, 2017 20:15 |
|
Apart from the boiler plate html needed to load react, everything should be components
|
# ? Jul 15, 2017 20:24 |
|
The Fool posted:Apart from the boiler plate html needed to load react, everything should be components Great thanks. New question. What am I missing here? (Might have spent way too much working on this today) code:
code:
code:
code:
|
# ? Jul 15, 2017 22:52 |
|
huhu posted:Great thanks. You're almost certainly getting that from the component rendering before your photos array is set in the state. Unless you are setting the photos array in your actual constructor the render method will be called before your state has that data.
|
# ? Jul 15, 2017 23:15 |
|
When using state, you want to set an initial state in your constructor.code:
|
# ? Jul 16, 2017 14:27 |
|
Thanks for the replies. New question. Is this article really the bare minimum to get Google Maps working with React? https://www.fullstackreact.com/articles/how-to-write-a-google-maps-react-component/ It feels like overkill. I'm trying to learn React with a project idea and I'm feeling no benefit yet of using it. I could probably build out my entire idea in plain JS/HTML/CSS with less code than that demo.
|
# ? Jul 19, 2017 00:39 |
|
Well, it looks like you can just install that package and use the Map component. The linked article is describing how he built it and a usage scenario. For really simple stuff React can definitely be overkill, but the usage of that component doesn't seem bad at all. edit: Additionally, it can be more complex or painful to integrate with 3rd party libraries as React then "loses control" unless you build it right.
|
# ? Jul 19, 2017 02:31 |
|
huhu posted:Thanks for the replies. Keep in mind that a bunch of that article is just walking back and forth across the same things to incrementally add new features, and then 90% of what's actually built out is to make a super generic Google Maps component meant to be reused in any project you ever make rather than a one-off with specific uses.
|
# ? Jul 20, 2017 01:33 |
|
Also depending on use case google maps licensing terms and costs can get complicated, consider using openlayers or leaflet if openstreetmap is good enough for you.
|
# ? Jul 20, 2017 18:21 |
|
Keeping the thread moving... I've been scratching my head for like an hour now. I have a method setLocation which I pass to the component <Search />. Search.js takes that function in and calls it inside searchSubmit() which results in "bundle.js:34004 Uncaught TypeError: Cannot read property 'props' of null". index.js code:
code:
|
# ? Jul 21, 2017 20:36 |
|
Try binding this inside your constructor function instead? Or using arrow syntax, which create-react-app supports inside of classes if you're using that. Maybe that'll help. Edit: Actually I think what's happening is that, since you haven't bound "this" inside of searchSubmit, it's creating a whole new execution context inside of searchSubmit. Try binding this for searchSubmit and it should work. code:
reversefungi fucked around with this message at 20:52 on Jul 21, 2017 |
# ? Jul 21, 2017 20:40 |
|
The Dark Wind posted:Try binding this inside your constructor function instead? Or using arrow syntax, which create-react-app supports inside of classes if you're using that. Maybe that'll help. Yeah this is the problem, just to be a bit clearer it's searchSubmit that has no bound 'this', so you need your constructor to do the binding: code:
Or use the class arrow functions as mentioned.
|
# ? Jul 21, 2017 20:50 |
|
Any suggestions on a library or approach to doing some simple midi / audio work inside a typescript project? Midi.js exists, but it predates modern module formats. Specific goals are to produce audio for exercises like those at http://www.musictheory.net/exercises.
|
# ? Jul 29, 2017 08:27 |
|
I'm a backend guy looking to learn React plus whatever the 2017 Javascript and front-end development stack looks like. I'm also trying to familiarize myself with front-end development and productivity tools. Can anyone link me to any primers or resources on the above?
|
# ? Jul 29, 2017 18:58 |
|
If your JavaScript chops aren't already up to snuff I'd recommend starting by reading JavaScript : The Good Parts. Then I really benefited from this tutorial series for learning react and redux: https://learnredux.com/
|
# ? Jul 29, 2017 19:20 |
|
Newf posted:Any suggestions on a library or approach to doing some simple midi / audio work inside a typescript project? Midi.js exists, but it predates modern module formats. Specific goals are to produce audio for exercises like those at http://www.musictheory.net/exercises. I used tone.js a long time ago for a small project. It was pretty sweet
|
# ? Jul 29, 2017 19:51 |
|
Grump posted:I used tone.js a long time ago for a small project. It was pretty sweet This looks like it's going to fit the bill, and also will provide me the chance to write my first .d.ts wrapper. Thanks!
|
# ? Jul 30, 2017 19:40 |
|
salisbury shake posted:I'm a backend guy looking to learn React plus whatever the 2017 Javascript and front-end development stack looks like. I'm also trying to familiarize myself with front-end development and productivity tools. Also look at create-react-app for starting a react project. It removes a lot of the overhead of figuring out babel/webpack first off.
|
# ? Jul 30, 2017 19:43 |
|
necrotic posted:Also look at create-react-app for starting a react project. It removes a lot of the overhead of figuring out babel/webpack first off. This. It just works, and 98% of the time it keeps just working as you add stuff.
|
# ? Jul 30, 2017 21:51 |
|
I'm using JavaScript and a canvas element that uses saves and restores for contexts. Works fine, but if I leave it on over night, it starts erroring like crazy that it can't find a matching save to a restore. There is a timer that updates a blinking cursor, but since it takes hours to get there, it's hard to debug. Any common issue to cause this?
|
# ? Aug 4, 2017 16:50 |
|
LP0 ON FIRE posted:I'm using JavaScript and a canvas element that uses saves and restores for contexts. Works fine, but if I leave it on over night, it starts erroring like crazy that it can't find a matching save to a restore. There is a timer that updates a blinking cursor, but since it takes hours to get there, it's hard to debug. Any common issue to cause this? I would speculate you've got some sort of memory leak and the browser is having a harder and harder time allocating memory. Or you don't have just 1 timer, but 1, then 2, then 3, then 4, etc, and after 8 hours you have 2000 timers running.
|
# ? Aug 4, 2017 17:04 |
|
Skandranon posted:I would speculate you've got some sort of memory leak and the browser is having a harder and harder time allocating memory. Or you don't have just 1 timer, but 1, then 2, then 3, then 4, etc, and after 8 hours you have 2000 timers running. Could be. I should see if I can keep track of context save and restores too to check if something weird is going on there too.
|
# ? Aug 4, 2017 17:33 |
|
I found this video interesting. Guy finds a site selling a way to create popunder windows for Chrome and he reverse engineers how it works from their demo page. https://www.youtube.com/watch?v=8UqHCrGdxOM
|
# ? Aug 4, 2017 19:03 |
|
My fun discovery of the weekcode:
|
# ? Aug 4, 2017 22:06 |
|
This is why people recommend typescript.
|
# ? Aug 4, 2017 22:12 |
|
huhu posted:My fun discovery of the week I suppose this is obvious but to anyone else learning JS: the plus sign operator defaults to string concatenation when any of the operands are strings whereas minus sign operator just coerces the string to a number if possible. Yeah it's confusing and dumb and a good reason to use Typescript. Also you can set up ESLint to ensure use of ES6 template literals instead of string concatenation, which you should.
|
# ? Aug 4, 2017 22:53 |
|
Thermopyle posted:I found this video interesting. Wow, good find. That whole channel looks interesting.
|
# ? Aug 4, 2017 23:11 |
|
Dogcow posted:I suppose this is obvious but to anyone else learning JS: the plus sign operator defaults to string concatenation when any of the operands are strings whereas minus sign operator just coerces the string to a number if possible. Yeah it's confusing and dumb and a good reason to use Typescript. Also you can set up ESLint to ensure use of ES6 template literals instead of string concatenation, which you should. Huh, I had assumed it only concatenated if the left side of the plus was a string because of all of the defensive empty strings I've seen in other peoples' code. I just to toString if I'm not sure - probably because I did Java first.
|
# ? Aug 7, 2017 18:18 |
|
JavaScript code:
You can see that transform calls callback synchronously, but is it also guaranteed that write calls transform synchronously and that callback calls the data listener synchronously? This works when I try it, and I think we have to have those guarantees, otherwise couldn't chunks hit transform or the data listener out of order? qntm fucked around with this message at 23:09 on Aug 7, 2017 |
# ? Aug 7, 2017 23:07 |
|
qntm posted:
My guess it's entirely dependent on the internals of 'stream', right?
|
# ? Aug 7, 2017 23:25 |
|
Is there something similar to JavaScript: The Good Parts that you guys would recommend that is newer for just Vanilla JS? It's quite old at this point. I realize that my Vanilla JS is pretty lacking even though I've been writing it for ~2 years and I've done nothing but jQuery for awhile so I'm getting a little sloppy?
|
# ? Aug 10, 2017 18:01 |
|
I like https://github.com/getify/You-Dont-Know-JS because it's open source and maintained quite well.
|
# ? Aug 10, 2017 19:33 |
|
yeah I always like referring to Airbnb's JS style guide for ES6 stuff too https://github.com/airbnb/javascript
|
# ? Aug 10, 2017 19:36 |
|
Thanks for the recommendations. I've got a new question. I have a table where a user can click edit on a row and via jQuery a new row will appear with nothing but input boxes. I have a file upload and I read that without "multipart/form-data" you can't upload the file. so I've wrapped the entire table in a form. However, I still can only get the file name and not the file. Is it correct to assume that the form is not recognizing the dynamically generated inputs? If so, how best to remedy this?
|
# ? Aug 11, 2017 19:41 |
|
huhu posted:Thanks for the recommendations. By "getting" the file you mean on the back end on submitting the whole form? There shouldn't be any problem with dynamically creating form elements in that case as long as they exist when the form is submitted and the fact that you get a name value means the input does exist in the form. Can you post any code? How is the form submitted, regular old submit button or via JS?
|
# ? Aug 11, 2017 20:41 |
|
Make sure all the inputs have names?
|
# ? Aug 11, 2017 20:42 |
|
I do too much (terrible stuff) with AJAX these days. Rewrote it to just be a regular form submit and it works.
|
# ? Aug 11, 2017 21:19 |
|
|
# ? Jun 5, 2024 08:27 |
|
So I have been working with react for quite some time, and for the most part all of my components are self contained. I am now replacing an old JQuery widget, and the way it worked was it was fairly self contained but them exposed some functions via JQuery so other parts of the code could add data to the container. I am not entirely sure how to do this with React. Would my only bet here be to do it via a redux-like store?
|
# ? Aug 14, 2017 17:10 |