7 posts tagged with "useState"

In this post we will begin wiring up the ability to manage settings in our GUI.

In this post we will begin wiring up the ability to manage properties in our GUI.

During the registration process we are asking users to provide more than just an email address and a password. We are asking for their first and last name, their company. However, to this point we are throwing that information away. It would be good to store that information somewhere.

In this post it is time to start leveraging our authenticated user. Upon successful login (or register) we will bring the user inside the application. We will also give them a mechanism to leave the application (logout). One of the key ways to help a user understand where they are in our application is through the menu. We will do some menu refactoring to make this easier.

In this post we will finally start bringing our application to life. We will create a handful of the pages that our application will use. I want to create (update) the user registration, login and forgot password pages. You may recall that those are all of the pages that can be accessed without logging in to our application.

A key part of what we will create in this post will leverage a library called Formik. I am a big fan of Formik, it reduces a tremendous amount of the boilerplate required by forms. Using libraries like Formik is a cornerstone to my development philosophy - don't be precious about code, if there is a good library available that will save time, use it. Formik can be integrated with another library called Yup which provides field level validation.

We will continue from where we left off in the last post. We setup some basic navigation. In this post we will explore how to adjust navigation based on who is logged in - a regular user or and administrator.

Our menus will only be seen once a user has logged in. This is, if a user is not logged in they will have access to the login, register and forgot password screens and nothing else. We will create two different sets of routes depending on whether a user is logged in, and, if logged in, we will wrap our routes in a container that holds our top level navigation.

In this post we will start to put together our navigation strategy for the application. We will use various components from Semantic UI React to drive navigation, primarily menus, in coordination with React Router.

Semantic UI React Menu - https://react.semantic-ui.com/collections/menu/