December 22, 2020
Hands-On Web Development with React and GatsbyJS is a course I authored to help beginning developers learn about GatsbyJS, while building a simple website that could be used as a building block for their very own website. It's preferred that you have at least some experience with React before taking the course as the content focuses on the Gatsby side of things but, even if you've never worked with React before, you should still be able to easily follow the videos and walk away with a basic website.
Gatsby makes it incredibly easy to build fast and performant Progressive Web Apps (PWA). This means your web app can also serve as a mobile application with features you'd otherwise only get if you built a native mobile application. Additionally, due to the fact that all your pages will be server side rendered, your web app will be static, cutting out request times and speeding up response time for your users.
Gatsby is open source and there have been a tonne of people who have contributed (over 3.5k at the time of writing this!) to adding features and making improvements. There's also a huge plugin library so it's easy to implement just about anything you need.
What is Covered in the Course?
Here's an overview of what you'll do and learn in the course:
- Getting Started with GatsbyJS: get an overview of the course, install Gatsby, work with React Helmet and metadata, and learn how to link pages with Gatsby.
- Querying Data with GraphQL: intro to GraphQL, query data from your pages, and learn how to use the StaticQuery API and useStaticQuery hook.
- Gatsby Plugins: learn about the different plugins Gatsby has to offer, browse the huge library, starting tracking events on your site, and take a look at how to potentially increase your click rate.
- Programmatically Creating Pages: write your first post in a markdown, build a template, add your gatsby-node file and work with the createPage and onCreateNode APIs, and write a page query.
- Working with Images in Gatsby: in this section you'll learn how to import files with GraphQL, use Gatsby Image, add images to your markdown files, and how to add a video.
- Contentful - Content Infrastructure: you'll learn what Contentful is, create a Contentful account, connect your app to Contentful, and write and update queries to pull data from your account.
- Deploying Your App: in the final section you'll set up a Netlify account, link your app's repo to Netlify, make a few small updates to your code base, and deploy your web app.
How to Get in Touch With Me
If you take the course and have questions or feedback you can reach out to me via:
- email: firstname.lastname@example.org
- twitter: @coding_love
Unfortunately, even though I'm the author, I have no control over the course itself in Udemy as the account where it was published belongs to Packt. Definitely here to give support if you need it. Also, apologies for anyone who doesn't like the fact I copied and pasted all the code in the videos. It was a request by the team at Packt when recording to keep video times down ¯\_(ツ)_/¯
Where to Find the Course
Hands-On Web Development with React and GatsbyJS can be purchased from 2 sites:
Happy learning and building :)