How the hell is it possible for this to have such a small number of views? This is awesome stuff, you are a wonderful teacher and I love the way you are typing the code in general and then later on edit it to suit our needs for this project in particular.
Thank you so much, Tom! Really appreciate you saying that. I think that this teaching style is very cool as well because I feel that it shows one how to approach a bigger problem in their coding career rather than just giving up. Get something basic working, even in a simple way, and keep marching towards what you want.
@@JakeHaugen Thank you for putting effort to teach us all this , we are all aware that the developer career path is probably the best career someone could have right now. IT is expanding faster then ever and we are making major improvements in making coding faster and faster, everything becomes more simple as time goes by, mostly because of these libraries we can use. Even though I started all this couple months ago, and since my javaScript pretty much sucks, I found this very interesting and this project was very promising as the project to basically start with.
very professional way of teaching, so beginner friendly👌🌟 If I hadn´t checked the views count i would have guest that this would have gotten 100s of thousands of views.
@@JakeHaugen Dude I keep comming back everytime I need to deploy some project to GH-Pages. You should do a little tutorial of that and more GitHub basic usage if you want more content in your channel! Thank you again Jake
Please how can I submit the project on freecodecamp after coding and completing the task with my vscode and chrome? The link on my browser is the local development sever "localhost:3000"....
That's the point of uploading it to github pages as done in the tutorial. Then you can submit that link. You also can copy the code over to a repl.it project and copy the url they give you in the browser preview while it's running.
thanx for the tutorial bro... just one thing i got stuck with the fontawesome ...i manage to use the facoffe icon but when i replaced it with the fatwitter it didnt work...what to i do wrong here??
Here's their troubleshooting docs: fontawesome.com/v6/docs/web/troubleshoot/ The most likely reason is that you aren't referencing the correct style of icons. Confusing I know, but Twitter is in the brands style on font awesome not the solid or regular styles.
Hi Jake, I'm having issues uploading my react app to GitHub pages. Since I've tried to upload it I've had issues around failure to compile and web pack errors. What do I do?
Error fixing is the toughest part of development. If you have a failure to compile it's a problem with your codebase. You might be missing some dependencies, have a missed filename somewhere, or have an incorrect character. It should give a more specific error as to why it's failing to compile. Look at the error code for which file and/or line is causing the error and comb through that character by character. There is an error somewhere.
I used udemy tutorial primarily. My favorite is Zero to Mastery. I did their full stack course and their react course. Both are pretty good because they takes you through such a large project which has been really useful for me as a freelance developer. I tried other resources like freecodecamp and codeacademy. While they are great if you're just starting programming they are terrible for react because you're on your own for larger projects. They also move beyond the class base components of past react to the modern functional components of react with hooks. Which are soo much better in my opinion. Just code along with those courses and you'll do great. What I did was code their first project exaclty then I rewatched the course and followed it loosly as I build my own first project to help guide me in building different parts of my site. The other things you need to consider is what goes around the front end development. Specifically the design, the state management, and the backend code. Because at least in the freelance world, people always want a full stack developer because they just have an app idea and want it to work like it does in their head. For design, you don't really need more than a youtube tutorial on figma and some screen shots of apps that you like the design of. Just use the tools overlay elements as an exact copy. Then learn how to use the grid systems, components, and find the best plug ins to help you out. You'll need to plan out app states so also learn about user flows. Moving to designing in react, I really like material-ui since they just reworked it to make styling components a lot easier and it's simple to just say "hey I need an accordian here" and fight the styles it to look how you need it to, rather than figuring out how to build your own accordian component and then style it anyways. I would like to use tailwind for my next project though as I do like the idea of utility classes to enfore an even stricter design system on myself. For state management: the ZTM react udemy course I mentioned uses raw redux in the course, which is considered a bit out of date today because you have to do a lot of boilerplate code and it is very confusing to manage. However, it gives you direct experience with the action-reducer state calls, which is useful for more complex state management and you'll use it for useReducer hooks in react. For beginners on your first big project, I would recommend react-toolkit as it's very easy to understand but there are a lot of great state management systems out there and I've just been using react's useContext hook recently. As an inbetween point the hardest part of building an app is API management. For that I highly recommend using react-query. I've fallen in love with it for my project as it just makes working with remote data so painless. You can make it work with react-toolkit but I found that to be a pain in comparison and started getting back to the "man I have to specify that as well?" of vanilla redux land. For backend code: if you're going to be building apps yourself I would quickly switch to Next.js or even Blitz.js because they are full stack react frameworks that it give you the ability to do server side programming without needing to have a seperate project. And if you're building anything that's not a static site, you're going to need some server side functionality and doing everything in firebase cloud functions or using a client side SDK gets restrive fast. I know that's a ton of info, probably should be it's own video, but just work through things at your own pace one paragraph at a time. I gave it to you in the order that I would personally tackle things. The full stack course will give you a bit of an overview of everything and then you'll dive into it with the react course. From there you can expand out and you'll start working with the documentation. P.S. react's offical docs are great for refrence of design patterns like higher order components and constructing your own hooks, but don't offer the detail I think a beginner needs for building a full project. Refrence them but don't have that be your primary intro to react IMO.
@@JakeHaugen Wow thank you for such detailed answer! It is very helpful for me as I just started learning about web development libraries. I agree about FCC, I felt a lack of knowledge while completing final projects. But anyway it gave me a good overview of the main frontend technologies.
How did you open QuoteBox.component.jsx around 55:01 ?? My href value for tweeting the quote is not picking up on ${author} and i'm trying to find the issue... Aside from that this video has been awesome and super helpful! Thank you!
How the hell is it possible for this to have such a small number of views? This is awesome stuff, you are a wonderful teacher and I love the way you are typing the code in general and then later on edit it to suit our needs for this project in particular.
Thank you so much, Tom! Really appreciate you saying that. I think that this teaching style is very cool as well because I feel that it shows one how to approach a bigger problem in their coding career rather than just giving up. Get something basic working, even in a simple way, and keep marching towards what you want.
@@JakeHaugen Thank you for putting effort to teach us all this , we are all aware that the developer career path is probably the best career someone could have right now. IT is expanding faster then ever and we are making major improvements in making coding faster and faster, everything becomes more simple as time goes by, mostly because of these libraries we can use.
Even though I started all this couple months ago, and since my javaScript pretty much sucks, I found this very interesting and this project was very promising as the project to basically start with.
same thought
very professional way of teaching, so beginner friendly👌🌟 If I hadn´t checked the views count i would have guest that this would have gotten 100s of thousands of views.
Thank you very much for the video!
you helped me a lot to understand and have basic knowledge about reactjs , thank you
u where the only tutorial that i can understand, u deserve more likes and views. Thx bro for your time
great jop thank you for your hard work
this really helped out a lot thanks to you many much bro!
Great video! Thank you, Jake!
Bro this is the shit. trust me the views will come. keep at it
You really help me out with a bunch of things bro, thank you very much!
You're very welcome. Comments like these help me out as well. Thank you as well! ☺️
@@JakeHaugen Dude I keep comming back everytime I need to deploy some project to GH-Pages. You should do a little tutorial of that and more GitHub basic usage if you want more content in your channel! Thank you again Jake
Thanks bro, this helped a lot
Great video pal! Thanks a lot
Please how can I submit the project on freecodecamp after coding and completing the task with my vscode and chrome?
The link on my browser is the local development sever "localhost:3000"....
That's the point of uploading it to github pages as done in the tutorial. Then you can submit that link. You also can copy the code over to a repl.it project and copy the url they give you in the browser preview while it's running.
@@JakeHaugen If I'm going with second step (repl.it), where do I post it on their website? Because I'm seeing a bunch of thing on the website
Thank you so much!!!
node-sass is deprecated it wont work after installing as a dependency
Thank you so match!
thanx for the tutorial bro...
just one thing i got stuck with the fontawesome ...i manage to use the facoffe icon but when i replaced it with the fatwitter it didnt work...what to i do wrong here??
Here's their troubleshooting docs: fontawesome.com/v6/docs/web/troubleshoot/
The most likely reason is that you aren't referencing the correct style of icons. Confusing I know, but Twitter is in the brands style on font awesome not the solid or regular styles.
thanks for help
Hi Jake, I'm having issues uploading my react app to GitHub pages. Since I've tried to upload it I've had issues around failure to compile and web pack errors. What do I do?
Error fixing is the toughest part of development. If you have a failure to compile it's a problem with your codebase. You might be missing some dependencies, have a missed filename somewhere, or have an incorrect character. It should give a more specific error as to why it's failing to compile. Look at the error code for which file and/or line is causing the error and comb through that character by character. There is an error somewhere.
Great tutorial! It helped me a lot!!
What resources did you use to study React?
I used udemy tutorial primarily. My favorite is Zero to Mastery. I did their full stack course and their react course. Both are pretty good because they takes you through such a large project which has been really useful for me as a freelance developer. I tried other resources like freecodecamp and codeacademy. While they are great if you're just starting programming they are terrible for react because you're on your own for larger projects. They also move beyond the class base components of past react to the modern functional components of react with hooks. Which are soo much better in my opinion. Just code along with those courses and you'll do great. What I did was code their first project exaclty then I rewatched the course and followed it loosly as I build my own first project to help guide me in building different parts of my site.
The other things you need to consider is what goes around the front end development. Specifically the design, the state management, and the backend code. Because at least in the freelance world, people always want a full stack developer because they just have an app idea and want it to work like it does in their head.
For design, you don't really need more than a youtube tutorial on figma and some screen shots of apps that you like the design of. Just use the tools overlay elements as an exact copy. Then learn how to use the grid systems, components, and find the best plug ins to help you out. You'll need to plan out app states so also learn about user flows. Moving to designing in react, I really like material-ui since they just reworked it to make styling components a lot easier and it's simple to just say "hey I need an accordian here" and fight the styles it to look how you need it to, rather than figuring out how to build your own accordian component and then style it anyways. I would like to use tailwind for my next project though as I do like the idea of utility classes to enfore an even stricter design system on myself.
For state management: the ZTM react udemy course I mentioned uses raw redux in the course, which is considered a bit out of date today because you have to do a lot of boilerplate code and it is very confusing to manage. However, it gives you direct experience with the action-reducer state calls, which is useful for more complex state management and you'll use it for useReducer hooks in react. For beginners on your first big project, I would recommend react-toolkit as it's very easy to understand but there are a lot of great state management systems out there and I've just been using react's useContext hook recently.
As an inbetween point the hardest part of building an app is API management. For that I highly recommend using react-query. I've fallen in love with it for my project as it just makes working with remote data so painless. You can make it work with react-toolkit but I found that to be a pain in comparison and started getting back to the "man I have to specify that as well?" of vanilla redux land.
For backend code: if you're going to be building apps yourself I would quickly switch to Next.js or even Blitz.js because they are full stack react frameworks that it give you the ability to do server side programming without needing to have a seperate project. And if you're building anything that's not a static site, you're going to need some server side functionality and doing everything in firebase cloud functions or using a client side SDK gets restrive fast.
I know that's a ton of info, probably should be it's own video, but just work through things at your own pace one paragraph at a time. I gave it to you in the order that I would personally tackle things. The full stack course will give you a bit of an overview of everything and then you'll dive into it with the react course. From there you can expand out and you'll start working with the documentation. P.S. react's offical docs are great for refrence of design patterns like higher order components and constructing your own hooks, but don't offer the detail I think a beginner needs for building a full project. Refrence them but don't have that be your primary intro to react IMO.
@@JakeHaugen Wow thank you for such detailed answer! It is very helpful for me as I just started learning about web development libraries. I agree about FCC, I felt a lack of knowledge while completing final projects. But anyway it gave me a good overview of the main frontend technologies.
@@JakeHaugen And yeah, l like the way you explain things and hope to see even more tutorials on your channel 😁
great!
How did you open QuoteBox.component.jsx around 55:01 ?? My href value for tweeting the quote is not picking up on ${author} and i'm trying to find the issue...
Aside from that this video has been awesome and super helpful! Thank you!
Great!!
Please someone should reply my previous comment..