These are chat archives for FreeCodeCamp/HelpJavaScript

31st
Dec 2018
tundeiness
@tundeiness
Dec 31 2018 08:27
hi guys, I am a bit confused on how to use react-markdown in codepen. Is there a specific approach that I have to use or how do I approach using it exactly?
I need heads up please. Thanks.
hamsterbox84
@hamsterbox84
Dec 31 2018 11:07
hi tundeiness what is your problem
hamsterbox84
@hamsterbox84
Dec 31 2018 11:28
@tundeiness here is an example of using react-markdown in codepen https://codepen.io/hamsterbox84/pen/QzOOPG
few tricky things are because I was not sure how to find a non-module build of react-markdown available so I added a javascript module loader
tundeiness
@tundeiness
Dec 31 2018 11:40
@hamsterbox84 thanks I will check it out. can you help check mine out? https://codepen.io/highness/pen/ebNYVX?editors=0010
tundeiness
@tundeiness
Dec 31 2018 11:50
@hamsterbox84 note that it is possible to load marked.js and react-markdown from codepen..I did import them but no impact on my design.
tundeiness
@tundeiness
Dec 31 2018 12:07
Still struggling with react-markdown plugin but this is my work so far: however there is no display yet https://codepen.io/highness/pen/ebNYVX?editors=0010 I don't know why and I need help.
abraham anak agung
@padunk
Dec 31 2018 12:53
@tundeiness it is working. You need to pu at right markdown like # This is heading put space after #
Jason Luboff
@JLuboff
Dec 31 2018 16:09
Morning :wave:
Christopher McCormack
@cmccormack
Dec 31 2018 16:33
@bgq007 hey sorry wasn't around yesterday, have family in town. You solve your issue?
@JLuboff what's up?
Jason Luboff
@JLuboff
Dec 31 2018 16:38
@cmccormack Was just running through a project euler algo for fun..
You?
Christopher McCormack
@cmccormack
Dec 31 2018 16:39
figured I'd play with Jest a little this morning
which challenge you doing?
Jason Luboff
@JLuboff
Dec 31 2018 16:40
I just did problem 6 (sum square difference)
Christopher McCormack
@cmccormack
Dec 31 2018 16:41
you do all the others?
Jason Luboff
@JLuboff
Dec 31 2018 16:41
Nah...thats only the second one I've done
Christopher McCormack
@cmccormack
Dec 31 2018 16:42
you doing them on FCC or PE?
Jason Luboff
@JLuboff
Dec 31 2018 16:42
FCC
Christopher McCormack
@cmccormack
Dec 31 2018 16:43
very cool. I found I couldn't quite move my old solutions over to FCC, gotta tweak them a bit
big plans tonight?
Jason Luboff
@JLuboff
Dec 31 2018 16:43
Nah... but having some friends over tomorrow for a bit of a BBQ
You?
Christopher McCormack
@cmccormack
Dec 31 2018 16:44
we have a few parties to go to but we may just stay home, been an exhausting few weeks
Jason Luboff
@JLuboff
Dec 31 2018 16:45
Ya, seems like oyu've been busy with familty
Alright..thats another one knocked out (largest product in a series)
Christopher McCormack
@cmccormack
Dec 31 2018 16:48
I want to do those again soon, just need some free time, hopefully in a few days!
yeah it's been so busy, feels like we've been constantly cleaning/cooking/eating/drinking the last week
Aditya
@ezioda004
Dec 31 2018 16:49
@JLuboff Project Euler (FCC) sucks in its current condition. The tests will timeout since the input is quite huge.
Jason Luboff
@JLuboff
Dec 31 2018 16:49
@cmccormack Figured I should get back into algo's... haven't really done many recently. Feel a bit rusty hehe
@ezioda004 Good to know
Sucks that that is the case but... not the first time lol
Christopher McCormack
@cmccormack
Dec 31 2018 16:50
@ezioda004 no man, you just gotta write more efficient code!
Aditya
@ezioda004
Dec 31 2018 16:50
Many of those are fixed in master but yeah its not pushed to production yet
Christopher McCormack
@cmccormack
Dec 31 2018 16:50
quantum code
Aditya
@ezioda004
Dec 31 2018 16:50
Big O(oof)
Christopher McCormack
@cmccormack
Dec 31 2018 16:50
haha
Aditya
@ezioda004
Dec 31 2018 16:51
What ya'll doing for new years?
Christopher McCormack
@cmccormack
Dec 31 2018 16:51
@JLuboff if there were a really good datastructure/algorithm of the day calendar that would be awesome, keep you fresh!
@ezioda004 probably sleep early lol
Jason Luboff
@JLuboff
Dec 31 2018 16:51
Staying home, sleep by 11 I'm sure
It's almost new years there isn't it?
Christopher McCormack
@cmccormack
Dec 31 2018 16:51
maybe rent a few movies
@ezioda004 @JLuboff oh yeah happy almost New Year!
Jason Luboff
@JLuboff
Dec 31 2018 16:58
Gitter being stupid?
alpox
@alpox
Dec 31 2018 17:08
@JLuboff hi ho. How is it going?
Christopher McCormack
@cmccormack
Dec 31 2018 17:08
@JLuboff why is it being stupid?
Jason Luboff
@JLuboff
Dec 31 2018 17:08
@alpox Hey going alright. Just a short day at work :) Yourself?
@cmccormack It had timed out one of my messages
alpox
@alpox
Dec 31 2018 17:09
@JLuboff no work until 3rd :) going quite well and got a bonus and a raise for next year
Jason Luboff
@JLuboff
Dec 31 2018 17:10
Bonus and a raise? Thats awesome, congrats!
alpox
@alpox
Dec 31 2018 17:10
@JLuboff thanks :) the raise is not that big but brings me about up to field standard salary
Jason Luboff
@JLuboff
Dec 31 2018 17:11
Hey...more money is more money haha
alpox
@alpox
Dec 31 2018 17:13
Thats true :D
Jason Luboff
@JLuboff
Dec 31 2018 17:16
:( my refactoring is breaking things lol
Jason Luboff
@JLuboff
Dec 31 2018 17:21
I guess it helps if I include both arguements to my function.. :joy:
BP
@bgq007
Dec 31 2018 17:23
Hey @cmccormack thanks for the hit back. Um. Not really an issue as much as looking to get a better understanding when it comes to React. HTML, CSS, JS makes sense to me because I create a file and the browser displays it. I get from a high level view that these Frameworks and Libraries need “something” to convert (I guess bundle is the word) the “stuff” into a those basic elements (HTML CSS JS) so the browser can display it. My question, or what I am trying to figure out, is what is Webpack, Babel, etc. What should we be using to create a React App so it will display correctly? Seems like we should just do the npm create-react-app or whatever the code is as that appears that it does everything I am asking about, but can that be deployed on a website? I realize that someone is going to tell me to read. I am, and watching videos. The reason I am asking is because I see people use WebPack, Babel, maybe WebPack and Babel, Browsify (or something like that)…. I am just trying to get an idea of what is going on in simple terms and not just follow along with someone who does it one way, another does it a different way and not realize they may be just doing the same thing but with different “helpers”
Christopher McCormack
@cmccormack
Dec 31 2018 17:25
@bgq007 the only thing that actually gets deployed is the JS bundle and html + assets. Tools like webpack take your JS files, use tools like babel to transpile/polyfill, and combine all the stuff you have local using npm or whatever into a single (or multiple if using code splitting) JS bundle files. They can also do quite a bit more than that but this is just a quick summary
BP
@bgq007
Dec 31 2018 17:27
So if you use the npx create-react-app my-app you dont need webpack or babel correct?
Jason Luboff
@JLuboff
Dec 31 2018 17:27
Its included in CRA
Christopher McCormack
@cmccormack
Dec 31 2018 17:27
I personally do not use CRA but many people do and seem to like it just fine. I used it a few times to get used to React but now use my own custom configs. up to each person how they want to do it. Tools like parcel can take some of the complication out as well, and we'll probably see more tools like this in the future that bring frontend dev back to something more familiar
yeah webpack and babel are deeper down but they are included. if you follow the scripts from the root package.json you can find it in the node_modules
BP
@bgq007
Dec 31 2018 17:28
Ive never been very comfortable with CLI, so doing things in the terminal makes me nervous. Im much more graphical in my learning
Christopher McCormack
@cmccormack
Dec 31 2018 17:29
hate to say it but you may want to get used to CLI
BP
@bgq007
Dec 31 2018 17:30
Oh I agree.
Christopher McCormack
@cmccormack
Dec 31 2018 17:30
now's as good a time as any
I used to be pretty uncomfortable as well but then I got a raspberry pi and started adding services to it - forced me to learn a lot and look up a lot to get a better understanding
BP
@bgq007
Dec 31 2018 17:30
I just find that when it comes to the CLI, because its not graphical, tutorials and reading to learn is more of a challenge.
Christopher McCormack
@cmccormack
Dec 31 2018 17:31
you're describing everyone
:)
BP
@bgq007
Dec 31 2018 17:31
OK. Well, I appreciate your time. I think I will just use the create-react-app. Seems the simplest
Christopher McCormack
@cmccormack
Dec 31 2018 17:32
yeah please do, that's its whole purpose :) when you do feel like tweaking it though feel free to ask and we can help
Pagnito
@Pagnito
Dec 31 2018 19:56
hey im building a frameworkless app to learn node, and i gotta api call, i read that innerHTML is unsafe for appending lists, anyone can give me some more info on this?
Christopher McCormack
@cmccormack
Dec 31 2018 20:02
@Pagnito probably due to injection attacks, which if you don't guard against can be pretty bad. easier to just not allow it at all
Pagnito
@Pagnito
Dec 31 2018 20:02
the injections?
Christopher McCormack
@cmccormack
Dec 31 2018 20:03
user input that adds to the html directly
Pagnito
@Pagnito
Dec 31 2018 20:03
so like sanitization?
i dont think my input is injecting html tho, now that i tihnk about it
Christopher McCormack
@cmccormack
Dec 31 2018 20:04
yeah
Pagnito
@Pagnito
Dec 31 2018 20:04
it just creates a string to use for a request
Pagnito
@Pagnito
Dec 31 2018 20:11
hey if i have content security policy header, that should prevent someone from being able to use somethig like alert() from console ?
Christopher McCormack
@cmccormack
Dec 31 2018 20:12
uh I don't think so but I'm not sure
you mean browser console right?
alpox
@alpox
Dec 31 2018 20:14
@Pagnito alert can always be used from the dev console
Pagnito
@Pagnito
Dec 31 2018 20:14
@alpox k thnx