React Project: GitHub Profile Viewer
In this tutorial, we’re going to take a look at using React Router to create some routed pages by creating a simple GitHub profile viewer
Code is here: https://github.com/codebubb/github-pr...
(Checkout the setup branch for the skeleton project)
React Project: GitHub Profile Viewer
————————————————
00:00 Introduction
00:22 Overview
01:27 Setup
02:42 Setting Routing up
07:58 Setting up the GitHub search
14:10 Displaying the Search Data
16:47 Repositories Route
23:14 Gists Route
28:31 Followers Route
33:32 CSS
34:00 Link Disable and Route disable
37:38 Wrap-up
So once your React application starts to get a bit larger you’re probably going to want to move certain sections or groups of components to their own pages. Let’s say if you had an edit page for updating resources and a list page for viewing a complete list of whatever it is you have stored in your data store.
It might be time to create separate pages or ‘routes’ to group those related components in one place.
In this tutorial, we’re going to dive straight in to creating a simple nav setup with the Link component and then create the corresponding pages or ‘routes’ to display different content depending on where the user navigates to.
So you’ll get a quick overview of the React router library and also how to use the Link component, switch component, route component and we’ll also take a look at the Redirect component towards the end of the tutorial.
To give the application a bit of a purpose we’ll also send some requests to the GitHub api with React and process the corresponding data to display information about a particular user’s profile information including retrieving extra information like their repository list, Gist lists and also their followers.
So hopefully by the end of this Junior Developer Central React router tutorial, you’ll have a good understanding of the React router library and the corresponding components to allow you to separate your content on to different pages. Channel Handle @codebubb
Nesta página do site você pode assistir ao vídeo on-line React Project: GitHub Profile Viewer duração hora minuto segundo em boa qualidade , que foi baixado pelo usuário Code With Bubb 27 Abril 2021, compartilhe o link com seus amigos e conhecidos, no youtube este vídeo já foi visto 2,289 vezes e gostou 56 espectadores. Boa visualização!
