Setting Up an Electron Project (P6D1) - Live Coding with Jesse

Key Takeaways

hey everybody welcome to live coding with jesse i'm jesse today we're going to do something new that we've never done on the stream and something that i've never done we are going to start building an electron app so if you're not familiar with electron i'll take a minute here and explain to the best of my ability what electron is so electron was developed by github specifically to build atom their editor but now it's been used for a lot of other things so if you ever use the slack desktop app or visual studio code and there's a lot of other things get cracking so it's it's a way to use html css and javascript to build applications that run on the desktop so they run like native applications native desktop applications and a lot of most people can't tell the difference so we're going to use that we're going to take in a project that we've already done in react which is the resource center and we're going to make a desktop app version of it so we're still going to use react uh we'll probably use create react app and then but we're also going to use electron with it so since i've never set up a project like this before i'm not sure how long it'll take we're going to try to get as much done as we can today i do have a meeting at three so that's um so it's 1 30 my time so in less than an hour and a half because it's a little after 1 30. i have to be at a meeting so i'm thinking maybe two pomodoro sessions and then questions after so that's the uh that's the plan today i'm let me show you what i'm using so let me switch up here so i can see what i see all right so this is the article that i found that i'm going to use now if anybody has used electron before specifically electron with react let me know if there's some better way to do this that you know of otherwise i mean i've spent not a really long amount of time but i spent a little while checking out different articles and different github repos on ways to start up your project with react and electron so this is what i found this article from react to an electron app ready for production and it has this awesome picture check that out i want that as a sticker on a laptop that would be sweet um is there some company where i can just send a picture into and they'll print me out a laptop sticker there's got to be something like that out there but uh that's a cool one anyway i don't know who drew this i don't want to just steal it off to ask permission i guess see who who made that anyway enough of the sticker stuff so i'm going to pull this off the screen and then so i'll have more room to work with at first we'll just be working in the in the terminal here and then we'll switch over to our code editor at some point assuming we get far enough to to do that um so these instructions came out june 13th of this year so they're not really really up to date but um i think they should they should work um i was looking through it they are you know they're using it seems like pretty up-to-date stuff i know you know we've had a major react you know update with version 16. um but we're gonna give it a shot and as long as it's still early on in the project if we find out like today or you know maybe the next day or something that hey there's some better way to do it then we haven't lost very much time we'll just wish to that okay i'm sure if you've watched before you've all seen me totally switch up a project even a week or two weeks in um all right awesome so we got decent number of viewers hey everybody uh especially if if you haven't joined before i'm about to start doing some coding and during that time i'm not really going to look at the live chat much so if you ask a question just hang on for a little bit after 25 minute period is up which i'm going to start a timer right now for that so after this 25 minute period is up i'll go back to the live chat read through as much as i can answer as many questions as i can then i'm going to do another 25 minute session of coding and then at the end of that i'll answer all your questions unless i get a lot of questions because i i do have to get my meeting but usually i can answer all the questions so let's get started let me make this a bit bigger i want to make sure everybody can see um also we did get some pull requests so we got a lot of pull requests that i merged maybe if we have time later on i'll go through what happened because there were several projects that i got pull requests so um i'll catch i'll try to catch you all up on on what went on if i don't have time today then we'll just catch up tomorrow all right so first things first let's go into our my projects folder so i'm going to cd projects all right now we're just going to do a simple create react app right we've done this before so let's use create react app and let's do what should we call this um let's stick with let's go with rc electron so the resource center electron so we know what we're using and let's see yeah that's that's all we should need so this when i hit enter um it should create a folder for us called rc electron and then within that folder it's going to give us everything we need to have a react app and in fact it will be a working react app but we can't stop there because we wanted to also work on a desktop with electron so as soon as this is finished we're also going to add electron okay so you can see when you fin if you haven't used this before it's kind of nice when it finishes it tells you exactly what was created and where it's at tells you commands to get started you'll be using start the most out of any of these you may never use eject and then even get let you tells you right away just type these two things and you'll be good so first thing we're going to do is what it says we're going to do rc electron so now we're in that folder if i um show all the files you can see we already have a readme package.json got a node module so we have every like i said everything we need for react app so now let's do the electron part i'm going to copy and paste because it's a a lot and i don't want to mess it up so i'm going to copy and paste and then we'll go through it so we're going to do a yarn add right so if you use npm you can do npm install and it'll do the same thing so we're installing we're adding the um npm packages for electron we're going to use the electron builder which this will help us whenever we actually want to make this a an app that can run natively we're going to get weight on and concurrently and then we're saving these as uh dev dependencies so you'll see uh what we're getting these for in a minute that's gonna help with um like our scripts let's see so let's hit enter i have a lot to install hopefully doesn't take too long all right well that's going i'll check the live chat whoops it already worked awesome so i don't think we got any errors awesome uh now we need to add one more thing um yarn out electron is dev i honestly have no idea what this thing does but it says to download it in a tutorial and i did not even see it mentioned when i read through the tutorial which i admit i didn't read every word of this so i expect that i'm going to mess up at some point during this at least once so just fair warning to everybody but that's kind of what this stream's all about i mean we do want to make cool stuff uh and then hopefully we all learn something but i mean really like the stream is so you all can see me mess up right and then try to get out of it together okay awesome we have everything cool we need to add an electron dot js file so that electron works with create react app so you'll be able to see what this file is in a minute let's um i'll tell you what let's do this i talked to i know a lot of you have been recommending visual studio code and i talked to some people at that november at the conference and they were saying you know some of them had switched from adam to visual studio code and they're saying how much they like it so i went ahead and i i downloaded some react plug-ins for visual studio code and i haven't tested them out yet but i think it would be cool to try to do this project in visual studio code let me pull it over here first so let's go with let's open this project i folded a workspace and where we have projects and then here's our rc electron project let's add it awesome so let's go in our public folder and we want to add let's make this big there we go and then i can increase the font size great all right so now hopefully y'all can see and i'm going to add a new file and we're going to call this file electron.js and then i'm going to paste this in so let's check this out i haven't even looked at this file yet let's look at it a bit and see what uh what's going on here so one of the plugins that i downloaded comes with this this stuff so it tells me how big all these things i'm importing are which i think is really cool probably won't really make a difference unless you know we import something and it's like huge and then maybe we might think about trying to use something else but i thought it was pretty cool actually used a thing called what was it called uh food truck react food truck so you just pull you get the plug-in called react food truck and then it installs a bunch of other react plug-ins i'm not going to go through them all now but they all seem super helpful so that's where i got most of these plug-ins that i'm using so if anyone's interested in that if you want more info i can i guess i'll just send a link right now let me put the link in the live chat right now so you all can check that out if you want there we go so it's in there now all right so let's let's go through this and make this one here we go let me know if you can't see if the font is too small so well i just glanced at the live chat and it is harsh it's birthday happy birthday so harsh you're 16 now right let me know if i'm wrong but oh no the link's a 404 page no let me see why is it a 404 page let me get rid of all that junk at the end of the link and see if it still works no it doesn't um all right here i'm just going to paste the title in here if you try to google that title then i'm hoping it'll come up i don't know what's going on with the link it works it works on my machine right i hate saying that but in this case it's true um all right so so we're bringing in electron obviously um electron.app browser window also so if you don't know i guess electron does what it does because it's built on top of chromium which is like um i guess like the core code of chrome the chrome browser something like that i'm not really an expert on all how that works but you can make a javascript css html app and then it runs on chromium but it runs in such a way that it looks and behaves like a native app like you you can have access to like the file structure and things like that uh i believe okay so like i said not the expert first time i'm working with it but i'm that's at least kind of big picture how it works so not only you know do you get the app but you also get chromium bundled with it which is basically the reason why i want to do this because then we i do not have to deal with outdated browsers and issues with that because we've had a really big problem with computers on campus here at the university i work for having very outdated versions of browsers like i'm talking about browsers that came out in 2007 right so we don't have to worry about this at all and i i came up with this idea at november talking with someone who actually works on the electron project they work for github um sharon i can't remember her last name but anyway she was one of the speakers at november so if you check out the november site and the speakers i'm pretty sure she's the only speaker named sharon and she's from github so uh anyway so based on what she was saying about electron it just occurred to me wait that could solve a lot of our problems so anyway that's why i thought we should do it and it'd be cool to learn how to do this um okay so anyway okay cool so it looks like this is just kind of setting up electron and setting up everything to run so great um let's move on all right so let's go to our package.json and we need to configure that to actually know where this file is right and use it so here we go package.json great all right so we're gonna add actually i should i think there's a completed repo of this there we go there is an example repo which is going to be super helpful you know how in when you're using a tutorial they just give you tiny snippets and it's not always that obvious where the snippets are supposed to go uh so i am going to also have the repo open at the same time so i could see like the final picture and what's going on with that okay cool so let's put in main oops main and then public public electron.js so that just tells it where that file is okay and so now we're going to add a script whoops sorry i'd scroll down too far i'm not there yet um we're still going to add a script though i'm going to copy and paste this because this is long and complicated so let's see in our scripts here we are in our scripts i'm going to add this after eject we could put it anywhere but i'm gonna add it there and if you see we have this big string and then we should be able to run after we do this so let me save this and let's run it let's run this script and see what happens we're not finished setting it up yet but this is good for dev at least it should be all right so would we just call that script electron dev all right so yarn electron dev all right no errors so far oh something's already running on 43 000 no what i have running i have way too many terminal uh tabs open all right all right let me turn this off oh okay i got it i got it it was our um it was our next uh app that we're building for that main site all right so let's let's try it now um there we go yeah cool and it runs it on the network too very cool um let me do this and then also let me run it on uh on ngrok and see see what that's like all right check it out we have a react app running on localhost let me put this i got my android going on another window here let me paste in the url alright so if anybody wants to check it out uh there's the link in the live chat and grock lets you all um inspect this and let's see yeah where did the window go and i have it running in the browser but it's not running it's not running like you a normal electron app would run so i'm trying to check out my windows here and see where it popped up where are you so i have an electron icon here you may not be able to see it it's probably underneath all right so you might you can barely see it right there in the uh bottom right hand corner but why is it not showing me anything all right let's move around a bit and see no no yeah let's move that over here while we're while we're here let's move this over okay um let me before i keep searching let's just read this output and see if it says anything um all right so i don't see anything in the hmm sorry i don't see anything in the tutorial that we're following that we did wrong trying to scroll back up yeah it looks like everything was fine so i guess we could just try it again let's do that let's try it again and let me make sure i'm not running anything else i don't think i am okay and oops let's see here um i'm gonna exit this out too i highly doubt that's affecting it but that was our um our app we our react native app i have it running on expo all right so let's get out of this let's try it again that's weird there we go oh let me check the live chat just see if anybody has any ideas um i see michael's idea have you tried turning it off and back on again that's a good idea where all right so hmm why is it showing sound coming from my react native debugger that's weird let's get out of there okay actually i didn't check on this screen let me check on this screen just in case no nothing hmm all right let me i'm gonna quit the electron um that was open in the bottom and then try this again see if it makes a difference i knew something would go wrong when we're setting this up let me check the live chat again check my time all right so in about two minutes i'm gonna go over the live chat and try to read through all your comments and questions okay that's interesting so i am getting the electron coming back up in um electrons coming back up in my my task bar or whatever it's called at the bottom of the mag window really uh okay it looks like all right here's the link okay so harshit has a link to the quick start guide let's check this out no i'm again a 404. all right so let me let's do the break okay and let me go to the live chat so if you're asking questions i'm going to try to get to them right now i'm going to scroll up a bit and oh cool i was asking about making a sticker and brian said sticker mule all right i have to check that out thank you okay um michael was asking about like what's going on with this project what project is it so yeah it's we're just gonna take the resource center that we've already built and react and we're going to make it uh an electron version of it so we're still gonna have that resource center site available for the browser but we're also gonna have a mobile app and we're gonna have a desktop app oh okay so yarn said i tried to give you all a link earlier to a visual studio code package and it didn't work but yarn said that if you google it and then click the link it's the same link but it doesn't give the 404 error so i know isn't that that's weird like it it works anyway uh-huh so i guess it will work if you google it i should ask if i've checked polyfill.io i did check that out harshit i just didn't have time uh to actually get it to put it on that project and test it out so um i will get to that at some point sorry um brian says still using netscape navigator is there a better browser yeah i mean what why did we ever need anything else besides netscape navigator [Music] john b says you should update the ie6 it's the best michael says you're going to use visual visual studio instead of atom for a project based on chromium interesting actually visual studio code is also based on on chromium so they're both electron apps which is interesting because i've heard people complain about atom and atom is so slow and electron is so slow but then you have visual studio code that people say so fast and it also runs on electron right so i don't think the problem is electron it's probably just how you use electron right and since atom was like one of the i think the first electron app maybe there's some legacy stuff for optimizations that it's just still there visual studio code's a lot newer i don't know i don't really know but that'd be my guess to explain the difference brian says john b do you have a set of floppies for ie6 you could send me see let's see all right steve stevie came in and says um why why electron um i want to use electron the idea is basically if i use electron then the people who will download this app i don't have to worry about their versions of their browser right because they're going to have chromium installed with this so uh i'll just get around all the problems that i've been having with people using really really old browsers uh gander7 asks which tutorial are you following i'm gonna throw this up on the screen now uh i'm using this tutorial from react to an electron app ready for production i guess i can paste this in as well if you all want to see it and stephen also asked just for some context on the video is this the first time you're using electron yes definitely the first time um michael says i'm confused what is is not happening okay so base let me let me scroll down and show you what's supposed to happen is i'm supposed to get a window like this so it's supposed to look like a native app and not a browser window so i can open this in a browser window which is awesome but it's not really any different than you know whatever we've done in the past with react what we wanted to see was this browser window pop up automatically so what we do have is that electron starts which is good we can see it here in the bottom right hand corner there that's electron that's the electron that we have uh loaded into our node modules but there's no window coming up so we've got to figure out why that is all right and didn't quite get through everything so i'm gonna make a note of where i'm stopping and then come back to it after our next 25 minute coding session okay and i'm going to scan quickly to see what you are saying about our specific problem here on the link i just pasted it looks like it's a 404 as well what is up with both of those links were from medium i think i don't know what's going on with that um i guess you can try to search then from react to an electron app ready for production i guess it's probably the same problem we had before all right so let me i'm gonna get several different suggestions it looks like so let me let me see local dependencies all right let's try it looks like rook has something that's we can try uh very easily to see if it'll work so um let's do this all right so that's where the shot because it's just such a simple fix if it works so let me close that out and then i want to make sure okay so that electron's gone from the taskbar that's good now let's start it up again see what happens this time so if this works it'll be awesome otherwise i'll go to some of the other suggestions that you'll have in there i always like to try the easiest thing first it doesn't always work but if it does then you save a ton of time okay so this is opening again and we still have no looks like nothing let me check my other screens just to be sure and i don't see anything yep not seeing anything okay well that was worth a shot let's um let me just remove that before i forget so we're have the same thing let me i'm going to check so the tutorial came with a repository a github repository so here's the finished package.json from that repository so maybe there's something in here that didn't get put in um in the tutorial or got maybe updated afterwards so let's compare here i'm gonna move i'm actually gonna move this on my other screen so i can compare it with what i have um interesting react so hmm okay it doesn't there's a bunch of other stuff in this package json so um let me copy and paste that link as well hopefully this one will work there's other stuff in here from later on the tutorial and that's basically for when we want to package this up when we're finished with it so we don't need it now but it looks like of the things that that we've done so far that we needed it's all fine it's the only differences are versions so there are some differences in the versions that we're using um it's possible that that that's the problem i was a little worried about this because the tutorial was from june all right let me check back in the live chat we'll go to the next suggestion here so all right let's see all right so a few of you are saying so george and at ashish are saying uh that they think i did not save the electron.js file i really hope that that is the issue so let's try it again now that i've saved it if that was it i'm going to be really happy and i'm going to laugh oh that was it [Music] yes i'm so glad that that was it i mean it it's so silly and i'm sorry that we wasted so much time check it out here we go we have a desktop app built with react so yeah it's it works and you can see this is running in the electron window so it's not like right it says electron up here right and awesome all right thanks again uh george and ashish um you all were right on target that was i i can't believe you caught that and i can't believe i forgot to save it so uh sorry i think i already said i'm sorry but i'll say it again in case i didn't i am sorry that i forgot to save this and we spent so much time [Music] all right okay great um i gotta take a drink of my g-fuel energy stuff because i just feel like yawning all the time and now it's a good time to take a little break so again if anybody's watching from g fuel i'd be happy to drink this on every show if you sent me some for free just putting that out there um all right great well let me think let me think what we should do next then i really thought like oh that's it like we're not getting anything else done all right let me check my time okay so it is 2 18 p.m my time so we are on track uh i'm pretty sure i will be able to make it to my meeting on time okay so we have what 14 more minutes in this pomodoro cycle great let's figure out what we're going to do then so i'm not going to touch this file again since it's working i don't want to mess it up let me get rid of some of these things that i'm not using okay so now let's check out let me close this we don't need it and let's check this out right we have a normal see our app.js right this is a normal um react app right so this should be uh yeah i mean i'm assuming that this should work out just like normal i also am assuming that there are probably some things that you can do with electron to work with some of like the underlying stuff in the operating system so if we need to do that which we might then we'll we'll get to that uh but for now um yes alright harshit you know exactly where i was going with that right so harsh it says copy your build files from the resource center to the public folder and you'll be good to go exact yes i it's just right when i opened this up i started thinking wait a second we use create react app for the resource center already so this will definitely work so let's do that let's first um let me find i think i still have it open bulletin franciscan i do not have it open okay uh let me let me open this up then uh i'm just gonna grab the resource center code from github and the so on my other screen that's that's what i'm getting right now so i we do need to bring in some stuff from the package json um probably a lot of stuff uh well um what do i need to bring it all right let me just bring in some of the ui stuff because now that i look at this like we have a formidable package json file here uh for that resource center so i'm not gonna pull everything over right now um okay what's harsh it's saying um arson says we bootstrapped uh sorry a harsh it says only the build files not the source no need of source really we can just bring over the billet files all right well let me get the build faucet uh hopefully i built this somewhere so let's go i'm looking for the project folder on my other screen here resource center food okay and okay let's copy that and see where we're at all right hold on i'm reading your stuff harsha don't worry um okay so copy the build files to the public folder all right let's grab these now let me make sure it's in here all right so evidently i can't just copy and paste right into there so let me find the right folder in my file structure uh this shouldn't take long here it is there we go um yeah let's replace replace replace okay see what's gonna happen i suppose and run app in production all right so what do i do to run this ah okay so first it says in the build folder uh okay so not in the public folder in the build folder all right whoa no what just happened hmm i can't dang it all right so all right let's find what did we have before index hang it okay all right says change the dev stuff from line number 13. are we talking about line number 13 in our package json or in another folder or another file i mean and electron.js okay line 13 okay so this is set for the build file okay all right let me grab that build folder and bring it in the whole folder this time okay so we should have a build folder now why didn't it show up let's see electron build that's weird um all right so harsh is saying remove local oh okay okay um i'll just do this that'll work right because it'll flip around that ternary alright so let's start this again see what happens all right so i'm getting something so it now says resource center did it say resource center before i don't even remember um i don't think it did it did open so here's where it opened at um it didn't really do anything let's check out our it actually shouldn't be running should it yeah it should not well i mean should we have it oh okay it because it's yarn start so that that does make sense um all right then all right how do i open dev tools in here there's got to be ah okay i i thought i saw something about devtools late i think it was later on in the uh in the thing so actually there's a lot more to this tutorial so maybe maybe i should have gone through the whole thing first ctrl shift i all right so that's not working for me so let's do okay right so let's see the top bar yes awesome great job uh thanks harsh it so the top bar did have an option to open dev tools so where is my dark theme at come on what is it gonna work no i can't do the dark theme on here i don't know we might just have to quit this project you can can't work with all this white um all right so let's see what's going on okay all right this makes sense um so since we didn't actually build things we just transferred this over uh these files static css main no wait a second they should still be there i still can't see it in there dang it um all right let me find it build static css now they're there i can see them in the file structure hmm all right so why food maybe i need i should say change it to file protocol in the files i am not sure hardship i'm not sure what your um what you're asking me to do so sorry about that uh could you explain it to me a little more please michael says after everything else this morning the lack of a dark theme in devtools might make you quit i just sat coming i will really quit over um the lack of a dark theme oh okay i get it harsh all right this will be let me check my time this will be the last thing i do if it works awesome if not we'll just continue this a different day so harsh is saying change it from http to file because this thinks it's a plain url and this thing ccp is playing europe okay so let's see change okay yeah so it is saying file here now where um all right so where am i i'm gonna look for this at why can i still not see this folder i want to like refresh oh well i'll just open it manually there is a refresh icon in here oh there it is yes awesome thank you again uh harshit in case you didn't catch it earlier i am going to use visual studio code now which is not my normal editor so if i make mistakes in here i blame it on that [Laughter] all right let's check it out and see [Music] we should be trying to get the files somewhere in here right there we go um so if we change this to file right and what it was is saying the file i have all the slashes sorry me and what else were we looking for maine and static there we go um do we need these slashes probably not right or do we see if this will work three slashes all right let's try that so cameron cameron's saying three slashes we'll give it a shot and whoa couldn't select your background color from the all right just close this for now see what happens all right so still same thing let's see what the errors are this time though um where did we find that before there we go hey the dark theme it came back okay so the project is saved now um okay john b says the triple slash is normal for the file protocol and header in chrome when the path is localhost remove the slash how many of the slashes jordan says hi hey jordan how's it going all right uh let's try to remove one slash now oh okay harsh say move move all remove all the slashes all right and like remove everything all right let's try that then as she says ngrok now shows resource center that's cool all right we'll give it a shot all right cool check it out oh nice look at that look at that it's working all right so cool nice wow very cool so i mean we have some some stuff right uh that's not exactly working correctly but a lot of the content is there there's some weird stuff yeah there's some weirdness going on with the hover so it's not perfect but i mean that's a lot like that's that saved a lot of time very cool all right okay cool so that's all i'm going to do today as far as code for the rest of the time that i have which is maybe like 10 minutes um i'm going to try to get through as much of the live chat as i can and i try to answer all your questions so if you have any questions please put them in the chat now if we get a lot of questions i may not be able to get to all of them but i will try my best and uh if you don't care to stay for the question and answer session thank you so much for watching and uh please join me back here again uh usually around 2 p.m eastern time is when i stream uh and of course you can always check out the recordings they're always available here on the free code camp youtube channel all right where did i leave off to one okay cool i'm gonna switch back over to this and i'll go back to the um the view of my desktop if we get a question that pertains to that all right so a lot of the stuff in the chat now you all trying to help me out with these mistakes i was making um so i'm gonna be skipping quite a bit oh okay harsha's asked if i've checked out native bass i've not checked it out maybe i have to check that out it says it uses next which is cool because i'm already familiar with next uh so thanks everyone for uh for you know this all the suggestions we were trying to figure out what was going on i see a lot of you had some good suggestions there uh nicholas says thanks for doing this i don't have time to follow along with you but i want to come back and work through uh the recording awesome yeah and if you can't be here in the live chat that's cool if you have any questions just uh send them to me on twitter or put them in the comments to the videos and i'll try to um get you an answer uh as soon as i can blake says i saw murder on the orient express last night it was awesome i'm i'm glad you liked it i have not seen it but now maybe i'll check it out oh i see harshad had an idea to try this on a clone of the resource center actually that would have been a much better idea would have resulted in the same thing right but instead of having to copy and paste stuff i would have yeah that would have been cool too uh it's some at some point rohan said time to update your resume i'm not i don't know what that was in reference to so if you're still watching let me know i'm not sure what i was talking about at that point in the live chat or maybe rohan's not even addressing that to me i'm not sure let me know please dimitri said how to be so cool coder like he um [Music] i don't know about being cool but um dimitri if you're still uh here watching us i would try if you want to start out being a coder i don't know how much you know already but if you're just beginning check out freecodecam.org sign up try out some of the exercises they're pretty um they're pretty easy at first and then get harder but that might give you an idea of maybe if you kind of like that kind of like front end uh programming stuff there's a lot of other things to do but check that out i guess there's a ton of other resources so if you're interested let me know send me something on twitter or you know here in the live chat or something and um i'd be happy to talk to you and figure out what you're interested in and points you the right direction maybe i see sanjay's said hi just joining the stream what has been happening since the start of the stream um it looks like cars should give gave an answer there um that was good basically says we bootstrapped an electron react project yep that's pretty much it we just did the basic setup uh create react app and we added an electron and then that gave us we've copied over some files from another project and that gave us kind of a basic basic app there's still some things that aren't working right and we haven't even tested out the forms at all so there's still some work to be done but we definitely saved a lot of time with actually building things out and designing uh let's see i've got some writing in maybe is that cyrillic characters so let me get out my trusty google translate here and see what that is so it looks like uh ilia says uh glory to ukraine all right so i guess elias from ukraine cool thanks for watching oh cool michael said i'm off to try the pomodoro clock on free code camp awesome i probably not still listening since you said that 10 minutes ago but uh good luck with that and once you finish it i'd love to see it if you have it publicly available or on github or something so um let me know if you're cool with me looking at it uh nino says how long have you been coding um five years but the first like year i wasn't i was working on websites but it was mostly like css stuff really basic um i don't i don't know some i don't know if you call css work and html stuff coding or not so depending you know but definitely for the last like solid like three years of javascript and i've been a full-time front-end developer for a little over two years now um harshit says can you show us the react native stuff is it working native bass and splash screen stuff yeah it's working it is working let me i turned off the server let me let me turn it back on so i'm gonna turn off this for now because they're both trying to run on poor 3 000 all right control what is this devs [Music] all right it's just gonna run i'll try to run it in the emulator but last time i tried to do that it's um oh shoot am i starting the wrong thing i think i am i am hold on i have it over here there we go um anyway last time i tried to start the ios emulator it didn't work so i'll give it a shot again if not i'm just gonna have to put my phone up to the camera which i know is not ideal um actually i could use i might have a better option we'll see let's see what happens i i have a simulator come on work this time hmm okay did not work this time maybe i have to update some stuff let's go with because of a problem that's very descriptive it's a simulator cannot be open because of a problem all right um you know what we'll probably let's save this for another stream because i could probably try to open it while i'm answering other questions but i have a meeting in six minutes right now so um let me i'll try to get it on here all right so let's here you check this out here if it is going to work you'll you'll see it work i'll keep reading um let's see nino says what other technologies do you know um no something went wrong no all right try it again it was it seriously just worked earlier uh today um let's see where's okay i know um so in addition to html css and javascript all right i'll just show you all um tomorrow um i would love to show you right now i just uh don't have time to figure out why this isn't working um so in addition to html javascript css i know a little bit of php um a tiny tiny bit of c-sharp i once made a calculator in c plus plus but i don't remember pretty much any of it now um that's about it i've done like super basic things in java and in python um so i think that's that's it like coding wise uh nina says do you have a website or portfolio i do have a website that that's old and hasn't been updated in a really long time it's just jesseweigle.com if you want to see it don't laugh when you see it actually you can laugh if you want to it's like i said it's been a really long time uh since i worked on that site a better thing is to check out my github page which is linked in the description check that out that has my recent projects in it let's see dimitri says why you so relaxed um i don't know this is just my normal i'm not really sure why you're asking if i'm so relaxed um i mean i'm generally a pretty relaxed person let's see i should ask if i had xcode installed i do have xcode installed but it's possible that it needs updated rohan said use visor to mirror the screen i do have visor i just didn't think i'd have time to get it started all right okay three minutes to my meeting so i really do have to go now thank you everyone for watching uh and for participating a live chat you all helped so much when i was messing things up uh but it's really cool first time ever for me and for the stream we got a uh an electron app started and it's actually running right now on my imac and um well it was running i just shut it off but it was running and uh we had styles there were buttons and links and they worked so really cool i'm excited about that uh we got further along than i thought we would which is great and tomorrow i'm not sure what we'll be working on tomorrow because we have a lot of projects going on right now but i'll figure it out when i get in tomorrow morning and uh i'll i'll see everyone tomorrow until then have a great day