These are chat archives for FreeCodeCamp/HelpJavaScript

16th
Jan 2019
Jason Luboff
@JLuboff
Jan 16 00:01
@bradtaniguchi how so?
Brad
@bradtaniguchi
Jan 16 00:03
@JLuboff A moderate refactor into a shared library, then adding it to the server-side, and refactoring the front-end code to use the shared lib. Perks of using typescript/js on both ends
Jason Luboff
@JLuboff
Jan 16 00:04
Hmmm mmmhm ya I got you
Brad
@bradtaniguchi
Jan 16 00:05
It's this sorta stuff that makes me see the advantages of using a mono-repo haha
Jason Luboff
@JLuboff
Jan 16 00:06
Well uh.. I screwed up some stuff on production app... so...BOOM!
Brad
@bradtaniguchi
Jan 16 00:08
GG prod down
Jason Luboff
@JLuboff
Jan 16 00:09
Got it fixed though...wasn't that big of an issue lol.
  1. Was supposed to make a certain form require a file...accidently made all similar forms require a file heh
  2. No worky in IE anymore... due to template strings :joy:
Brad
@bradtaniguchi
Jan 16 00:25
Gotta look into babel:P
Jason Luboff
@JLuboff
Jan 16 00:26
Nah...no need for this project...unless I end up moving it into React which would be quite a while down the road
Brad
@bradtaniguchi
Jan 16 00:29
hmm I see, legacy project
Jason Luboff
@JLuboff
Jan 16 00:29
Not legacy...I just didn't know React then lol
I used templates instead
Nate Mallison
@NJM8
Jan 16 03:14
@alpox What machine?
I got an X1 Extreme dual booting Winblows and Pop Os ATM. It's a bit of a learning curve for me, it's been a long time since I played with linux.
alpox
@alpox
Jan 16 08:01
@NJM8 Lenovo T480S
Comes close to the X1 Extreme, is with 14" a bit smaller though
Is Pop_OS worth it?
Nate Mallison
@NJM8
Jan 16 10:40
@alpox I don't have much experience with Linux distro's but Pop os is great. Everything on the machine works as expected, it's easy to navigate and everything looks fantastic.
My only complaint so far is more machine related. Battery life is terrible. I kinda wish I'd gotten the T580 with the larger battery. Stock settings I'm getting maybe 2.5 hours? Had to switch to loDPI and intel graphics to get anything decent.
But that is Lenovo's fault for putting a 80 kw battery in a machine with a I7-8850H and a GTX 1050 ti max-q
alpox
@alpox
Jan 16 10:57
@NJM8 I have a P51 and its battery life is also absolutely terrible which is why I wanted a new one
The T480S has an awesome battery life of up to 15 hours
Nate Mallison
@NJM8
Jan 16 12:36
Isn't the P51 brand new?
alpox
@alpox
Jan 16 12:37
The P52 is newer
But P51 is still quite new. Its a workhouse and not thought for taking it on the way (as I now have to though)
Nate Mallison
@NJM8
Jan 16 12:39
What do you mean?
Do you know how to disable the beep when I enter the bios on startup? It's super annoying
I guess the only way would be to keep the volume off when I shutdown.
It didn't do it at first
alpox
@alpox
Jan 16 14:25
@NJM8 I did not try yet but I believe there should be a setting in the bios
tundeiness
@tundeiness
Jan 16 15:15
Hi guys, can anyone help with resources for musical instruments? I mean where I can download musical instruments' beat/tones. It's for the drum machine project please. Thanks. @alpox @NJM8 @JLuboff
Simon Cordova
@gbsimon87
Jan 16 15:28
whats up whats up!
Nate Mallison
@NJM8
Jan 16 15:28
@tundeiness javascript30 tutorial has a drum machine project with sounds
Looks like I uploaded them to github. No peeking! haha
Christopher McCormack
@cmccormack
Jan 16 16:00
@gbsimon87 hey GM!
Jason Luboff
@JLuboff
Jan 16 16:08
Morning everyone
Simon Cordova
@gbsimon87
Jan 16 16:11
Morning Morning - says the guy at 4PM
what's going on
Headed back to Canada this sunday will be more aligned with the schedule with the west coasters
how's everyone been?
Jason Luboff
@JLuboff
Jan 16 16:11
Just rolled into work
Doing well...yourself? How's chile been?
Simon Cordova
@gbsimon87
Jan 16 16:15
I'm in London, got back here Jan 1st
Chile however was amazing tbh with you
Went to Atacama desert, spent Christmas there, in a city named San Pedro
Got to see friends from 10 years ago hadn't seen since the uni days in Valparaiso and Viña del Mar too!
Also took my mother and lady to Montevideo, twas an exciting time overall
Christopher McCormack
@cmccormack
Jan 16 16:17
That does sound exciting! I drank some egg nog then went back to work, about the same amount of fun I would say
Simon Cordova
@gbsimon87
Jan 16 16:17
Practiced driving manual and didn't get us in an accident which is great, although I certainly had a scare while going up a hill
Oh man haven't had egg nog in a while :/
Christopher McCormack
@cmccormack
Jan 16 16:18
well you wouldn't during summer in Chile I bet
but now that you're back in the best hemisphere...
@gbsimon87 do they have a lot of manual vehicles there or was it just to learn?
Simon Cordova
@gbsimon87
Jan 16 16:19
They've got lots, especially in Valparaiso and Viña as so many people live on the hills, Santiago not so much
Jason Luboff
@JLuboff
Jan 16 16:19
I tried to drive a manual once
Simon Cordova
@gbsimon87
Jan 16 16:20
Check out Valparaiso, https://tinyurl.com/ycqbj2wr
Manual is actually rather fun, I was at an empty parking lot with the lady practicing the start, which appeared to be the hardest part to be honest, but I got it by the end
Christopher McCormack
@cmccormack
Jan 16 16:21
it's fun until you don't want to keep doing it :)
I was not a great manual driver, then I got a motorcycle and that really helped me understand the clutch, and also that I wanted an automatic motorcycle lol
Simon Cordova
@gbsimon87
Jan 16 16:21
I felt like Schumacher out there
Christopher McCormack
@cmccormack
Jan 16 16:22
haha
Simon Cordova
@gbsimon87
Jan 16 16:22
manual motorcycle - sounds like a no no to me
Jason Luboff
@JLuboff
Jan 16 16:22
...you felt like a vegetable?
Christopher McCormack
@cmccormack
Jan 16 16:22
most are manual
Simon Cordova
@gbsimon87
Jan 16 16:22
It just honestly feels waaaaaay cooler, makes automatic rather boring
Christopher McCormack
@cmccormack
Jan 16 16:23
it definitely makes you feel in control. When I do my 90th 2 hour drive from Flagstaff to Phoenix in a week or two, though, I will be very happy I don't have to bother shifting gears lol
Simon Cordova
@gbsimon87
Jan 16 16:27
Hey whats happening with you guys president man?
on a quick change of subject
Jason Luboff
@JLuboff
Jan 16 16:27
The same shit thats been happening?
Simon Cordova
@gbsimon87
Jan 16 16:27
They've got a national Jerry Springer broadcast in the White House smh
Christopher McCormack
@cmccormack
Jan 16 16:28
The people are just getting what they asked for, the government being shut down until we get a wall that we were told another country would pay for. Same Same
/end politics
Simon Cordova
@gbsimon87
Jan 16 16:29
Mexico would pay for it, lolololololol
What did the voters really expect?
Oh man, I feel bad honestly
That country is far too great for all this drama
Christopher McCormack
@cmccormack
Jan 16 16:29
I think they literally expected that to happen
Simon Cordova
@gbsimon87
Jan 16 16:30
I genuinely feel it affects me, apart from being Canadian, I have many close American friends, including the lady
Christopher McCormack
@cmccormack
Jan 16 16:30
Yeah it's not good, immigration isn't something you should legislate based solely on emotion
Jason Luboff
@JLuboff
Jan 16 16:31
The whole immigration system is a mess regardless
Christopher McCormack
@cmccormack
Jan 16 16:31
I have a lot of good friends here on work visas that have been here ~10 years and still aren't certain what's going to happen to them, good hard working people that contribute to the economy. That's where we should start
Simon Cordova
@gbsimon87
Jan 16 16:33
It's wild out there - this guys a loose cannon
Apart from racism, fascism, and other negative ism's, I really want to talk to a die hard Trump fan, peacefully, just to know a bit of their insight
Ask something like did you really expect a wall payed by your neighbour? I mean c'mon, seriously, c'mon, what sensible grown adult could've bought that?
anyways...
Tiago Correia
@tiagocorreiaalmeida
Jan 16 16:35
Hello everyone, has anyone applied CI over a gitlab project?
Jason Luboff
@JLuboff
Jan 16 16:36
Hey man
And no
Christopher McCormack
@cmccormack
Jan 16 16:37
@tiagocorreiaalmeida @alpox was trying to do that yesterday I think, maybe he figured it out
Tiago Correia
@tiagocorreiaalmeida
Jan 16 16:39
Thanks @cmccormack
Christopher McCormack
@cmccormack
Jan 16 16:39
huh thought that would summon him
Tiago Correia
@tiagocorreiaalmeida
Jan 16 16:40
ahaha I messaged him, thanks for the info
Simon Cordova
@gbsimon87
Jan 16 16:45
CI on Gitlab no, my team has on GH though
I'm actually using Gitlab quite a bit these days because of a new client, it's pretty smooth as well
Christopher McCormack
@cmccormack
Jan 16 16:48
a GUI client?
Simon Cordova
@gbsimon87
Jan 16 16:49
You could say, NDA agreement disallows me from sharing the client name and specific details but they deal with property management etc and have a huge mapping system
Jason Luboff
@JLuboff
Jan 16 16:49
Ah...great...legacy app has a plugin that I have no clue where to find...coool
Christopher McCormack
@cmccormack
Jan 16 16:49
lol thought you meant a client for gitlab
like Git for Windows or something :)
@JLuboff you're going to be a sage when you finally leave that job
Jason Luboff
@JLuboff
Jan 16 16:51
I'm going to turn into a plant?!
Christopher McCormack
@cmccormack
Jan 16 16:54
yes, 1/4 of a thanksgiving turkey rub
but really more like this guy
Jason Luboff
@JLuboff
Jan 16 16:57
haha
Master Roshi!
But seriousily...I can't debug this fucking thing because it won't compile
Simon Cordova
@gbsimon87
Jan 16 16:59
I'm actually having a smooth day at work today, FINALLY
Been behind for so long
Christopher McCormack
@cmccormack
Jan 16 16:59
you two even each other out!
@gbsimon87 been a good learning experience?
Simon Cordova
@gbsimon87
Jan 16 17:01
It's been simply amazing to be honest with you
I've learned so so much
Speaking of learning, anybody have any React code for implementing a checkbox that checks/unchecks other checkboxes
lol
Christopher McCormack
@cmccormack
Jan 16 17:02
no but I would probably maintain all the checkboxes in some parent state and run a function each time you check the box that affects others against the checkbox data structure
Jason Luboff
@JLuboff
Jan 16 17:05
Alright..done with the legacy app for now...moving on
Simon Cordova
@gbsimon87
Jan 16 17:07
A bit more complicated than that...
image.png
It can only select all per category, oh man, I already know my catching up is done
Christopher McCormack
@cmccormack
Jan 16 17:09
don't know what you mean
Jason Luboff
@JLuboff
Jan 16 17:11
Have those checkboxes associated with their group?
Simon Cordova
@gbsimon87
Jan 16 17:12
yeah
so each box is a different company, and they've got different phases, I have no idea how I'm about to keep track of it
Jason Luboff
@JLuboff
Jan 16 17:13
keep an object/array in state with each company as a key and their value an array with the names of the associated checkbboxes?
Christopher McCormack
@cmccormack
Jan 16 17:15
I think that should work, an array of objects, each object has two properties, name and phases
maybe an array of input values (boolean) to keep track of checked-ness
Jason Luboff
@JLuboff
Jan 16 17:16
Thats sort of the design I have for my app. I have hazards and each hazards has associated controls
Simon Cordova
@gbsimon87
Jan 16 17:18
I'll give that concept a shot, I've screenshotted the comments, thanks guys
how's the learnings on your ends?
Christopher McCormack
@cmccormack
Jan 16 17:19
Haven't been doing as much lately :/ kind of in a slump after completing FCC, need to find some motivation to work on a personal project
Simon Cordova
@gbsimon87
Jan 16 17:20
casually throws in that he completed FCC lolol congrats buds!
Christopher McCormack
@cmccormack
Jan 16 17:20
heh thanks
Simon Cordova
@gbsimon87
Jan 16 17:20
how are you so damn good at all this?!?
Christopher McCormack
@cmccormack
Jan 16 17:20
I wouldn't say good, but I spent a lot of my free time working on it and trying stuff out, I was completely hooked for a while there
Jason Luboff
@JLuboff
Jan 16 17:21
@gbsimon87 I've been learning about testing, been having a lot of fun with testcafe e2e tests
Christopher McCormack
@cmccormack
Jan 16 17:21
I want to follow @JLuboff into the e2e testing realm next :)
Jason Luboff
@JLuboff
Jan 16 17:21
@cmccormack Check out testcafe!
Christopher McCormack
@cmccormack
Jan 16 17:23
@gbsimon87 my motivation was always to be able to build a nice tool for work for our engineers to interact with our new Software Defined Networking management tools, but somehow that took a back seat wanting to get really good at web dev lol
Simon Cordova
@gbsimon87
Jan 16 17:24
@cmccormack I wonder if you calculate your every move when making love to the wife lol
you're always seeming to be on point
:)
Christopher McCormack
@cmccormack
Jan 16 17:24
@gbsimon87 hah jeeze little personal
Simon Cordova
@gbsimon87
Jan 16 17:24
no disrespect intended
Christopher McCormack
@cmccormack
Jan 16 17:25
@JLuboff I will, is it a suite?
Jason Luboff
@JLuboff
Jan 16 17:25
Christopher McCormack
@cmccormack
Jan 16 17:27
@gbsimon87 what's your motivation lately?
Simon Cordova
@gbsimon87
Jan 16 17:32
Just to be really good tbh
There's something about it I really enjoy about making things and watching it come to life
Christopher McCormack
@cmccormack
Jan 16 17:34
Totally. Web dev is pretty cool because you can actually see a finished product visually.
you can build GUIs in other languages but it's not quite the same, and doesn't have the universalness of the browser
Simon Cordova
@gbsimon87
Jan 16 17:44
Exactly
Man I'm so proud of a filter I just created with a custom component I built hahaha
such a nerd
const clientProjectsList = !!clients && clients
                                  .filter(client => !(!Array.isArray(client.projects) || !client.projects.length))
                                  .map(client => (
                                    <GeneralListItem
                                      listItemType='clientProject'
                                      hasCheckBox={true}
                                      hasHeadingTextOnly={true}
                                      heading={client.name}
                                      hasDropdownArrow={true}
                                      hasExpandedContent={true}
                                      />
                                  ))
Christopher McCormack
@cmccormack
Jan 16 17:44
being proud of your work is noble, not nerdy
Simon Cordova
@gbsimon87
Jan 16 17:45
Don't be afraid to help me refactor! haha
And true, fair enough
Christopher McCormack
@cmccormack
Jan 16 17:45
do you know about demorgan's laws?
I think your filter can take advantage of them to write it a bit simpler
(maybe)
Simon Cordova
@gbsimon87
Jan 16 17:46
Hmm, I'll read about it this evening
thx for sharing that
Christopher McCormack
@cmccormack
Jan 16 17:47
np
Jason Luboff
@JLuboff
Jan 16 17:47
Sort of fixed the legacy app issue :thumbsup:
Christopher McCormack
@cmccormack
Jan 16 17:48
discrete math was one of the best classes I took in University to understand logic, I forgot most of it but I feel that class should be taught way earlier and to everyone, not just CS majors
@JLuboff haha "sort of"
it's probably a lot more useful than calculus to a general audience
Jason Luboff
@JLuboff
Jan 16 17:51
@cmccormack Ya... sort of... the issue was a chart was only displaying to 12/31/2018. I found the query reference in the source code and started looking there as I couldn't use breakpoints as I had planned due to not being able to compile properly. I looked into the view that was being queries and found it had a join between another view and a table based on the month. Well the table didn't have 01/2019. So I manually added it, and now the chart displays properly. The reason sort of is becuase I have no idea what/where the date should be being inserted..so I may just have to setup a job each month
Simon Cordova
@gbsimon87
Jan 16 17:54
I felt calculus was amazing tbh, could be used in real life companies, but again, half my life ago
Christopher McCormack
@cmccormack
Jan 16 17:55
@JLuboff oh man that sounds like some super sleuthing!
@gbsimon87 agreed that calculus is very useful, I just meant if you had to teach one or the other to a general audience I feel discrete math would be more useful. Specialty fields that are math heavy would definitely still have to take calc
Jason Luboff
@JLuboff
Jan 16 17:56
Ya...the old programmer/dba had a love for views I guess.. pretty annoying since he'll reference another view within a view so its just a mess to go through and see whats actually being queried
Simon Cordova
@gbsimon87
Jan 16 18:11
Boys I'm out
have a great night all :)
Jason Luboff
@JLuboff
Jan 16 18:11
See ya
Christopher McCormack
@cmccormack
Jan 16 18:12
@gbsimon87 see ya
Nate Mallison
@NJM8
Jan 16 19:57
TIL that state[key].findIndex(item => item.uuid === payload.uuid) returns zero when the item and payload don't have a uuid property. fun fun
Kaz Baig
@kbaig
Jan 16 20:05
@NJM8 because undefined === undefined is true every time
Jason Luboff
@JLuboff
Jan 16 21:11
TIL there's an array method findIndex
alpox
@alpox
Jan 16 21:15
@JLuboff Pretty nice one
Jason Luboff
@JLuboff
Jan 16 21:18
Whats the difference between findIndex and indexOf though? From the looks of it... you pass a callback to findIndex?
Brad
@bradtaniguchi
Jan 16 21:20
@JLuboff Indexof you pass the reference of the item in the array, findIndex is more like find, but instead of returning the reference to what is "found", it returns the index in the array for the item that is found
Jason Luboff
@JLuboff
Jan 16 21:21
Got it
Kaz Baig
@kbaig
Jan 16 21:27
@JLuboff easiest way to think about is if you need equality comparison or something else
Jason Luboff
@JLuboff
Jan 16 21:28
Ya
Brad
@bradtaniguchi
Jan 16 21:39
I hate it when people complain they aren't getting help (talking about another channel, not this one hehe) -__-
Jason Luboff
@JLuboff
Jan 16 21:39
Maybe you should help them then!
Brad
@bradtaniguchi
Jan 16 21:41
told them to create a stackblitz with the issue, they complained stackblitz isn't working, and they expected more people to help. Getting the feeling the expect help with their issue
Jason Luboff
@JLuboff
Jan 16 21:45
Well..can't help those who can't help themselves
So...my linter is complaining that I should use array destructuring here..
this.name = Selector(`#actionForm${id}`).elements[1];
I guess it could be [ , this.name]?
Kaz Baig
@kbaig
Jan 16 21:48
it could but that would be gross
Jason Luboff
@JLuboff
Jan 16 21:48
Ya...I agree

given... my next three lines are pulling values from the same array... so I guess I could have

[ , this.name, this.reviewDate, this.completionDate, this.comments]

..

Then it doesn't look...as gross
Kaz Baig
@kbaig
Jan 16 21:51
oh yeah that would make more sense
Jason Luboff
@JLuboff
Jan 16 21:51
Ya..thats probably why its complaining lol
Kaz Baig
@kbaig
Jan 16 21:51
maybe
[
  ,
  this.name,
  this.reviewDate,
  this.completionDate,
  this.comments
] = Selector(`#actionForm${id}`).elements;
Jason Luboff
@JLuboff
Jan 16 21:52
Yup except for the =this.name = part
Kaz Baig
@kbaig
Jan 16 21:52
oh oops lemme edit
there
Jason Luboff
@JLuboff
Jan 16 21:53

This is how prettier formatted it

    [, this.name, this.reviewDate, this.completionDate, this.comments] = Selector(
      `#actionForm${id}`,
    ).elements;

:shrug:

Kaz Baig
@kbaig
Jan 16 21:53
eh I like mine more I think
Jason Luboff
@JLuboff
Jan 16 21:53
As do I
Kaz Baig
@kbaig
Jan 16 21:54
Perhaps have the comma on line one but idk how easy that would be to configure
Jason Luboff
@JLuboff
Jan 16 21:55
Eh...I 'll leave it for now
Pagnito
@Pagnito
Jan 16 21:56
hey who here uses typescript on the server?
Jason Luboff
@JLuboff
Jan 16 21:56
@bradtaniguchi uses Typescript but I don't know to what extent
Brad
@bradtaniguchi
Jan 16 21:56
@Pagnito We use typescript for our express app, and have a nestjs app too
Pagnito
@Pagnito
Jan 16 21:57
@bradtaniguchi did u guys start with https://www.typescriptlang.org/samples/
Brad
@bradtaniguchi
Jan 16 21:58
@Pagnito no, I personally created mine as a hybrid from our previous backend and what I learned through working with it. The previous backend I think was generated using yeoman
Pagnito
@Pagnito
Jan 16 21:59
@bradtaniguchi k, sweet, ima starting a new course and thinking about using typescript on the server, ill ask you some questions if anything, when i set it up, is that cool?
Brad
@bradtaniguchi
Jan 16 22:00
@Pagnito yea that's fine, my knowledge is really limited to our setup tho, since it's all custom to our use-case so I'm sure there are gaps in my knowledge haha. (Like we don't use mongoose)
Christopher McCormack
@cmccormack
Jan 16 22:01
@bradtaniguchi you use VS Code in Linux?
Brad
@bradtaniguchi
Jan 16 22:01
@cmccormack Yes
Christopher McCormack
@cmccormack
Jan 16 22:01
any issues?
abraham anak agung
@padunk
Jan 16 22:02
Good morning, a little help with svg and gatsby anyone?
Pagnito
@Pagnito
Jan 16 22:02
@bradtaniguchi i feel u
Brad
@bradtaniguchi
Jan 16 22:03
@cmccormack Related to it being on linux? Not one bit haha. So far my experience with both atom and vscode has been perfectly fine on linux, when compared to using it on windows. Hell I share my config between the two and have no issues
Kaz Baig
@kbaig
Jan 16 22:03
@padunk what do you need
Christopher McCormack
@cmccormack
Jan 16 22:03
That's great, I'm planning on setting up another dual boot but was curious
abraham anak agung
@padunk
Jan 16 22:03

Why i can't render svg like this in gatsby?

const Icon = ({src, alt}) => (
   <img src={`../images/${src}.svg`} alt={alt} />
);

but it worked if i hardcode it like

import alphaStar from '../images/alphaStar.svg'

const Icon = ({src, alt}) => (
   <img src={alphaStar} alt={alt} />
);
Brad
@bradtaniguchi
Jan 16 22:04
@padunk I think the "compiler" that renders the gastby site from react code needs the reference, otherwise it wont include the file.
I'd attempt todo the first one, but add the import at the top of the file and see if that works. (not sure how the path will survive tho
and this is only coming from my knowledge of how parcel works (same issue applies there) and I know you need to import react the same way even if you aren't "using" it
Christopher McCormack
@cmccormack
Jan 16 22:05
I believe you always have to import outside resources gatsby or not
abraham anak agung
@padunk
Jan 16 22:06

@bradtaniguchi i tried this, but won't work

I'd attempt todo the first one, but add the import at the top of the file and see if that works. (not sure how the path will survive tho

Christopher McCormack
@cmccormack
Jan 16 22:06
at least with Webpack, not sure what gatsby is using
abraham anak agung
@padunk
Jan 16 22:07
@cmccormack so do i need to add something? like gatsby plugin or modify the webpack?
i think gatsby using webpack tho
gatsby uses webpack
Brad
@bradtaniguchi
Jan 16 22:08
Seems like gatsby has a number of ways todo this, but looks like you need to use the graphQL stuff to get it going dynamically
thats outside of what I know tho
Kaz Baig
@kbaig
Jan 16 22:09
Generally speaking I think you need to use graphql in gatsby to work with assets
Oh there's a page in the docs for this https://www.gatsbyjs.org/docs/adding-images-fonts-files/
abraham anak agung
@padunk
Jan 16 22:10
@kbaig Ok, sounds like that what i need. Lemme try it.
Brad
@bradtaniguchi
Jan 16 22:11
Actually now that your here @padunk How you like working with gatsby? I was going to check it out next to finally create a legit portfolio
abraham anak agung
@padunk
Jan 16 22:11
@kbaig do i need to install svg-react-loader too?
@bradtaniguchi haha, i'm working with that too
my portfolio
Kaz Baig
@kbaig
Jan 16 22:12
@bradtaniguchi I'm using it for my personal page too haha
abraham anak agung
@padunk
Jan 16 22:12
kind of confusing for me at first, cause it has a lot of plugin and starter template
Brad
@bradtaniguchi
Jan 16 22:12
yea so do you guys like working with it? I'm not a React guy, but for such a simple use-case it should be fine haha
abraham anak agung
@padunk
Jan 16 22:12
but it pretty fast
Kaz Baig
@kbaig
Jan 16 22:13
@bradtaniguchi It actually promotes itself as an easy way to learn React
Which I can see because it really only asks you to look at React as a component builder
its tutorial teaches you about react without teaching you about state for example
I really like working with it so far
I'm going to be implementing a blog so it'll help with that
@padunk if you see the github page for that plugin you'll see that's exactly what it does for you
abraham anak agung
@padunk
Jan 16 22:15
@kbaig do you use any starter for a blog? i'm thinking about adding it too
Kaz Baig
@kbaig
Jan 16 22:15
@padunk nah I'm doing it from scratch for learning purposes
abraham anak agung
@padunk
Jan 16 22:16
@padunk nice :thumbsup:
Brad
@bradtaniguchi
Jan 16 22:17
kewl kewl, now the only thing I don't understand at this point is where the graphQL part comes. I mean for a portfolio I wont need anything of that right? But then when would graphQL come in, or is it for stuff like the SVG issues mentioned above?
abraham anak agung
@padunk
Jan 16 22:21
@bradtaniguchi i think it is already bundled with it, and graphQL is what makes it fast.
Kaz Baig
@kbaig
Jan 16 22:21
@bradtaniguchi graphql is used to query the filesystem at build time mostly
So you can, for example, build out your blog posts written as markdown files into full pages with routing
Brad
@bradtaniguchi
Jan 16 22:23
@kbaig So the graphql part is used just during the build phase then?
Brad
@bradtaniguchi
Jan 16 22:40
Wow slack runs on redux?
Jason Luboff
@JLuboff
Jan 16 22:41
Duh
( I actually didn't know that)
Christopher McCormack
@cmccormack
Jan 16 22:46
@padunk sorry I had to leave for a bit, but I don't think you need to add anything, just use your import like you did. You should be able to use the import then access it using the relative path:
import alphaStar from '../images/alphaStar.svg'

const Icon = ({src, alt}) => (
   <img src={`../images/alphaStar.svg`} alt={alt} />
);
imports are required for adding assets, just like the linked article states
Brad
@bradtaniguchi
Jan 16 22:47
yea me neither, I can't tell if it uses redux tho, but the redux devtools is "on" when on the slack app in the browser. Interesting stuff to see some innner workings for some production apps haha
Jason Luboff
@JLuboff
Jan 16 22:51
@bradtaniguchi Rain hit you guys yet? I think it's coming from the North...
Brad
@bradtaniguchi
Jan 16 22:54
@JLuboff All day last 2 days more or less
Ah yes, testing what I think is rock-solid code to find a bug, testing is cool :P
Jason Luboff
@JLuboff
Jan 16 22:55
Ya same here but it was clear up until about 2 hours ago
And ya...testing is cool! Too bad I didn't give ID's to all my elements so I'm having to figure the damn selector out
abraham anak agung
@padunk
Jan 16 23:00
@cmccormack I using props to pass the filename cause i want to reuse my Icon component, but it still don't work.
I think i try adding gatsby plugin later and see how it works.
import alphaStar from '../images/alphaStar.svg'

const Icon = ({src, alt}) => (
   <img src={`../images/${src}.svg`} alt={alt} />
);
Jason Luboff
@JLuboff
Jan 16 23:01
...well I feel stupid... I had the selector right for a while... but I wasn't asserting properly :joy:
Christopher McCormack
@cmccormack
Jan 16 23:02
@padunk did you pass alphaStar down as props? I wasn't giving you the solution only showing your code with the import
you don't need any utility, I do this all the time with webpack
abraham anak agung
@padunk
Jan 16 23:03
@cmccormack yes, there is a wrapper outside the Icon component and i mapping the data from the parents to render couples of svgs
weird, maybe its gatsby? :smile:
Christopher McCormack
@cmccormack
Jan 16 23:04
@padunk log the string you're passing to img src prior so you can see if you're passing it properly
I don't think it's gatsby you just have to pass it correctly
abraham anak agung
@padunk
Jan 16 23:10

@cmccormack the string log correctly, so i think it has something to do with this, from gatsby docs.

To reduce the number of requests to the server, 
importing images that are less than 10,000 bytes returns a data URI instead of a path.
This applies to the following file extensions: svg, jpg, jpeg, png, gif, mp4, webm, wav, mp3, m4a, aac, and oga.

since my svg is less than 10,000 bytes.

Christopher McCormack
@cmccormack
Jan 16 23:12
I'm not sure why that would cause you an issue
abraham anak agung
@padunk
Jan 16 23:19
@cmccormack yeah, lemme see why it didn't render correctly later.
I have to catch breakfast here.
Thanks for helping ! :thumbsup:
Christopher McCormack
@cmccormack
Jan 16 23:25
np if you're still having issues later maybe try making a simple example project to display a single SVG and see if you can get it to work
Jason Luboff
@JLuboff
Jan 16 23:57
@cmccormack So have you started playing with testcafe yet?