We may earn an affiliate commission when you visit our partners.
Course image
Trevor Sawler

React and Go are something of a match made in heaven. React is the world's most popular JavaScript library for building Single Page Applications, and Go is uniquely well-suited for building REST back ends. That is what this course is all about.

Read more

React and Go are something of a match made in heaven. React is the world's most popular JavaScript library for building Single Page Applications, and Go is uniquely well-suited for building REST back ends. That is what this course is all about.

This course has been completely re-done, for React version 18 and React Router version 6. The old version of this course is still available at the end of the new one, with each section marked as "Legacy." I'll remove it in a month or so, just to give people who have already started a chance to finish that version, if they so desire.

Learn how to develop and deploy a fast, secure web application built using the most popular and in-demand JavaScript front end (React), with one of the most popular and powerful programming languages for the back end (Go).

React is an open-source, front end JavaScript library for building user interfaces or UI components. React is maintained by Facebook and a community of developers and companies. React can be used as a base in the development of single-page or mobile applications. React is the most popular front-end JavaScript library in the field of web development, and is used by many well-known organizations, including Netflix, Instagram, and the New York Times. With React, we build fast, interactive user interfaces.

Go is a modern, type safe, compiled, and extremely fast programming language. It it is ideally suited for building safe, scalable, incredibly fast REST APIs and web applications, and is also used by large corporations around the wold, including Netflix, Instagram, American Express, and the New York Times.

If you were paying attention, you might have noticed some overlap there the same large companies using React are also using Go. There is a reason for that, and we will be exploring that reason in this course.

In this course we will go over the core fundamentals of React, including the React life cycle, components, functional components, props, state, and more. We will also cover calling a remote API (both one we build, and a 3rd party API), and much more.

In the first part of the course, we'll build a simple application using both React class component and Functional Components with hooks. Although hooks and functions appear to the the future for React, there are literally millions of lines of code out there built using classes, so it's important to know how to work with React using both classes and functions & hooks.

In the second project for this course, we'll build a Single Page Web Application (SPA) with a React front end and a Go back end API, where we will  cover receiving requests on the back end, both as JSON and as GraphQL, and returning that response as JSON.

In order to secure access to authenticated users for certain parts  of our site, we will also explore how to generate and use JSON Web Tokens (JWT), including refresh tokens.

This course is not intended for absolute beginners. I expect that you have some experience in JavaScript and Go, and a good knowledge of HTML.

Enroll now

What's inside

Learning objectives

  • Build amazing single page applications with react js
  • Build reusable, composable components in react
  • Build a rest api in go that handles json requests, and serves json responses
  • Build an api in go that handles graphql requests

Syllabus

Introduction
Welcome
Notice for existing students
A bit about me
Read more
Asking for help
Mistakes. We all make them.
Setting up our development environment
Installing Node
Installing Go
Installing Visual Studio Code
Installing Docker
Getting Started with React
How React works
Hello world with React using Classes
Hello world with React using functional components
Styling Components
Using Bootstrap CSS
Using props: passing data to components
React and State I
React and State II
React and State III
React and State IV
React and State V
Intercepting form submissions with onSubmit()
handleSubmit() continued
Ref: using references in React
References with components: forwardRef()
Class Lifecycle
Getting started with our main project: Go Watch a Movie
Getting started with our project
Setting up the application layout
Getting started with React Router v6
Configuring React Router
Using React Router's Link
Working on the Movies component
Routing from the Movies component to individual movies
Displaying an individual movie
Setting up User Login
Working on the Login button
Creating the login form
Giving the Login component access to setJWT
Adding error messages and redirects to the Login component
Logging out
Getting started with our Back End API
Starting the back end API
Adding handlers and routes to our API
Installing a routing package
Adding a route to our handlers
Returning JSON from our API
Returning a list of movies as JSON
Connecting the front end to the back end API
Enabling CORS middleware
Enabling React's proxy to the back end API
Connecting to Postgres
Setting up our database using Docker
Getting started connecting our API to Postgres
Installing a database driver and connecting to Postgres
Setting up a database repository I
Setting up a database repository II
Improving the allMovies handler to use our database
Working with JSON
Setting up utils.go and a writeJSON helper function
Adding a readJSON helper function
Adding an errorJSON helper function
Using our errorJSON helper function
Authentication with JWT
Installing a JWT package
Generating tokens
Setting default values for JWT tokens
Creating a handler to generate a JWT
Trying out our handler
Generate refresh token cookie
Reading a JSON payload in the authenticate handler
Looking up a user by email
Validating a password
Updating the Login component on the front end
Refresh tokens I
Refresh tokens II
Refresh tokens III
Refresh tokens IV
Refresh tokens V
Protecting routes using JWT tokens
Authentication middleware
Adding our middleware to routes
Trying our our protected routes
Create/Read/Update/Delete for our Movie Catalogue
Starting on the Add/Edit movie component
Creating a select component
Creating a checkbox component
Using our input controls to create the edit movie form
Continuing to work on the EditMovie component
Getting a movie and Genres from the database
Creating handlers to get movies for public and admin
Displaying a movie to the public on the front end
Getting started with showing genres on the Add/Edit movie component
Adding checkboxes for genres to the front end form
Enabling checkbox clicks on the EditMovie component
Validation I
Validation II
Creating a database method to insert a movie

Good to know

Know what's good
, what to watch for
, and possible dealbreakers
Develops React front ends and Go back ends, which are essential tools for modern web and mobile app development
Teaches both React class components and React functional components, providing a comprehensive understanding of React
Builds a full-stack web application using React and Go, providing hands-on experience with both technologies
Covers advanced topics such as JWT authentication and GraphQL, which are essential for building secure and scalable web applications
Taught by Trevor Sawler, an experienced software engineer with a strong reputation in the React and Go community
Assumes some prior knowledge of JavaScript and Go, making it suitable for intermediate developers

Save this course

Save Working with React and Go (Golang) to your list so you can find it easily later:
Save

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Working with React and Go (Golang) with these activities:
Review HTML and JavaScript
Brush up on the fundamentals of HTML and JavaScript to strengthen your understanding of the basics required for this course.
Browse courses on HTML
Show steps
  • Review HTML tags and syntax
  • Review JavaScript variables, data types, and operators
  • Review JavaScript functions and event handling
Follow a React Tutorial Series
Enhance your React knowledge by following a structured tutorial series that covers essential concepts and best practices.
Browse courses on React
Show steps
  • Find a reputable React tutorial series
  • Watch the videos and complete the accompanying exercises
  • Apply what you've learned to your own React projects
Read 'The Road to React' by Robin Wieruch
Gain a comprehensive understanding of React concepts and best practices by reading this essential book.
Show steps
  • Read the book thoroughly
  • Take notes and highlight important concepts
  • Apply what you've learned to your own React projects
Six other activities
Expand to see all activities and additional details
Show all nine activities
Join a React Study Group
Enhance your understanding of React by collaborating with peers and discussing concepts in a study group setting.
Browse courses on React
Show steps
  • Find or create a study group with other React learners
  • Meet regularly to discuss React topics
  • Share knowledge, solve problems, and provide mutual support
Build a Simple React App
Solidify your understanding of React by building a simple application from scratch.
Browse courses on React
Show steps
  • Create a new React project
  • Create a React component for each page of the application
  • Implement state management to handle user interactions
Create a Repository of React Resources
Deepen your understanding of React by creating a comprehensive repository of useful resources, including tutorials, articles, and code snippets.
Browse courses on React
Show steps
  • Gather a variety of React resources from different sources
  • Organize and categorize the resources based on topic
  • Include a brief description and link for each resource
Mentor Junior React Developers
Strengthen your understanding of React and help others learn by becoming a mentor to junior React developers.
Browse courses on Mentoring
Show steps
  • Identify and connect with junior React developers who need guidance
  • Share your knowledge and experience through code reviews, discussions, and Q&A sessions
  • Provide constructive feedback and support
Develop a React-based Website
Put your React skills to the test by creating a fully functional React-based website.
Browse courses on Full-stack Development
Show steps
  • Plan and design the website's structure and functionality
  • Build the front-end using React
  • Develop the back-end API using Go
  • Integrate the front-end and back-end components
  • Test and deploy the website
Participate in a React Hackathon
Challenge yourself and showcase your React skills by participating in a hackathon that focuses on React development.
Browse courses on React
Show steps
  • Find a suitable React hackathon
  • Form a team or participate individually
  • Develop a creative and innovative React-based solution
  • Present your project to the judges

Career center

Learners who complete Working with React and Go (Golang) will develop knowledge and skills that may be useful to these careers:
Full-Stack Developer
A Full-Stack Developer is responsible for both the front-end and back-end development of websites and web applications. A course covering both React and Go would be highly valuable to those seeking a career in Full-Stack Development, as it provides a comprehensive understanding of the technologies used in both aspects of development. The course's focus on React, Go, REST APIs, and database connectivity would be particularly relevant to those seeking a role in this field.
Back-End Developer
A Back-End Developer designs, develops, tests, and maintains the server-side logic and infrastructure for websites and web applications. A course covering React and Go would be highly beneficial for Back-End Developers, as it covers the necessary technologies and concepts used in back-end development. The course's focus on Go, REST APIs, and database connectivity would be particularly relevant to those seeking a role in this field.
Front-End Developer
A Front-End Developer is responsible for the design and implementation of user interfaces for websites and web applications. A course that combines React and Go can help build a solid foundation for aspiring Front-End Developers, as it covers the necessary concepts and technologies used in front-end development. The course's focus on React, CSS, and JavaScript would be particularly relevant to those seeking a role in this field.
Web Developer
A Web Developer creates and maintains websites and web applications. Those interested in becoming a Web Developer may find a course covering React and Go especially helpful as it involves learning technologies that are in high demand in the industry. By gaining proficiency in these technologies, learners can increase their marketability as Web Developers.
Database Administrator
A Database Administrator is responsible for the maintenance and administration of databases. A course covering React and Go may be useful to those seeking a career in Database Administration, as it covers topics related to database connectivity and data management. The course's focus on connecting to Postgres and working with JSON data would be particularly relevant to those seeking a role in this field.
DevOps Engineer
A DevOps Engineer is responsible for bridging the gap between development and operations teams. A course covering React and Go may be useful to those seeking a career in DevOps, as it covers topics related to software development and deployment. The course's focus on topics such as Docker, Kubernetes, and continuous integration/continuous deployment (CI/CD) would be particularly relevant to those seeking a role in this field.
Software Engineer
A Software Engineer designs, develops, tests, deploys, maintains, and modifies software systems. A course that covers React and Go may be particularly useful to those seeking a Software Engineer role because it covers technologies commonly used in the development of software products, including web applications. The course's coverage of topics such as React, JavaScript, Go, and REST APIs would help build a foundation for aspiring or practicing Software Engineers.
Software Architect
A Software Architect designs and oversees the architecture of software systems. A course covering React and Go may be useful to those seeking a career in Software Architecture, as it covers topics related to software design and development. The course's focus on topics such as software design patterns, system architecture, and best practices would be particularly relevant to those seeking a role in this field.
Product Manager
A Product Manager is responsible for the planning, development, and launch of software products. A course covering React and Go may be useful to those seeking a career in Product Management, as it covers topics related to software development and product management. The course's focus on topics such as user experience (UX) design, product roadmaps, and market research would be particularly relevant to those seeking a role in this field.
Technical Writer
A Technical Writer creates and maintains technical documentation, such as user manuals, white papers, and training materials. A course covering React and Go may be useful to those seeking a career in Technical Writing, as it covers topics related to software development and documentation. The course's focus on topics such as technical writing best practices, documentation tools, and software development processes would be particularly relevant to those seeking a role in this field.
UX Designer
A UX Designer is responsible for the user experience (UX) of websites and web applications. A course covering React and Go may be useful to those seeking a career in UX Design, as it covers topics related to user interface design and development. The course's focus on topics such as user research, prototyping, and usability testing would be particularly relevant to those seeking a role in this field.
Project Manager
A Project Manager is responsible for the planning, execution, and delivery of software projects. A course covering React and Go may be useful to those seeking a career in Project Management, as it covers topics related to software development and project management. The course's focus on topics such as project planning, risk management, and stakeholder management would be particularly relevant to those seeking a role in this field.
Data Analyst
A Data Analyst collects, analyzes, and interprets data to provide insights and make recommendations. A course covering React and Go may be especially useful to those seeking a career in Data Analytics, as it covers technologies commonly used in data analysis and visualization. The course's coverage of topics such as data cleaning, data transformation, and data visualization would be particularly relevant to a role in this field.
Data Scientist
A Data Scientist uses scientific methods, processes, algorithms, and systems to extract knowledge and insights from data in various forms, both structured and unstructured. A course covering React and Go may be useful to those seeking a career in Data Science, as it covers technologies commonly used in data analysis and visualization. The course's coverage of topics such as data cleaning, data transformation, and data visualization would be particularly relevant to a role in this field.
Machine Learning Engineer
A Machine Learning Engineer applies machine learning algorithms to solve real-world problems. A course covering React and Go may be useful to those seeking a career in Machine Learning Engineering, as it covers technologies commonly used in data analysis and visualization. The course's coverage of topics such as data cleaning, data transformation, and data visualization would be particularly relevant to a role in this field.

Reading list

We've selected six books that we think will supplement your learning. Use these to develop background knowledge, enrich your coursework, and gain a deeper understanding of the topics covered in Working with React and Go (Golang).
Is the official guide to the Go programming language. It provides a comprehensive overview of the language, from its syntax and semantics to its concurrency and garbage collection mechanisms. It is written by the creators of the Go language and is considered the definitive reference.
Comprehensive guide to building React applications. It provides a thorough overview of the React framework, from its core concepts to advanced techniques. It includes detailed explanations, examples, and exercises to help readers build scalable, performant, and maintainable React applications.
Provides a practical guide to building applications with Go. It covers the fundamentals of Go, including its concurrency and garbage collection mechanisms. It also includes detailed examples and exercises to help readers build their own applications.
Provides a comprehensive guide to building React applications. It covers the fundamentals of React, including its core concepts, such as components, state, and props. It also includes detailed examples and exercises to help readers build their own applications.
Provides a collection of blueprints for building common applications with Go. It covers a wide range of topics, including web development, concurrency, and database access. It valuable resource for both beginners and experienced Go developers.
Provides a quick and easy guide to building React applications. It covers the fundamentals of React, including its core concepts, such as components, state, and props. It good choice for beginners who want to get started with React quickly.

Share

Help others find this course page by sharing it with your friends and followers:

Similar courses

Here are nine courses similar to Working with React and Go (Golang).
Building Applications with React 17 and Redux
Build a Full Stack App using React and Express
Developing Cloud Apps with Node.js and React
MERN Stack Front To Back: Full Stack React, Redux &...
Build Your First React Website (Part II)
React JS Web Development - The Essentials Bootcamp
The Modern React Bootcamp (Hooks, Context, NextJS, Router)
React - Working with Higher Order Components
Expanding Your JS Skills with React
Our mission

OpenCourser helps millions of learners each year. People visit us to learn workspace skills, ace their exams, and nurture their curiosity.

Our extensive catalog contains over 50,000 courses and twice as many books. Browse by search, by topic, or even by career interests. We'll match you to the right resources quickly.

Find this site helpful? Tell a friend about us.

Affiliate disclosure

We're supported by our community of learners. When you purchase or subscribe to courses and programs or purchase books, we may earn a commission from our partners.

Your purchases help us maintain our catalog and keep our servers humming without ads.

Thank you for supporting OpenCourser.

© 2016 - 2024 OpenCourser