Book Image

Isomorphic JavaScript Web Development

By : Tomas Alabes, Konstantin Tarkus
Book Image

Isomorphic JavaScript Web Development

By: Tomas Alabes, Konstantin Tarkus

Overview of this book

<p>The latest trend in web development, Isomorphic JavaScript, allows developers to overcome some of the shortcomings of single-page applications by running the same code on the server as well as on the client. Leading this trend is React, which, when coupled with Node, allows developers to build JavaScript apps that are much faster and more SEO-friendly than single-page applications.</p> <p>This book begins by showing you how to develop frontend components in React. It will then show you how to bind these components to back-end web services that leverage the power of Node. You'll see how web services can be used with React code to offload and maintain the application logic. By the end of this book, you will be able to save a significant amount of development time by learning to combine React and Node to code fast, scalable apps in pure JavaScript.</p>
Table of Contents (16 chapters)
Title Page
Credits
About the Authors
About the Reviewer
www.PacktPub.com
Customer Feedback
Preface

Server authentication


We will use Express in our server and react-router and redux in the client, as we did with examples in the previous chapter. We will cover:

  • Users sign up
  • Log in/out
  • Protecting routes
  • Handling navigation to protected routes without being logged in

Sign up

Signing up is the process of adding a new user to your system, to recognize that user in the future and provide him with exclusive permissions that non-signed-up users don't have. It's a super popular use case and a very important one in the web applications.

The basic idea of our sign up process will be like this:

In this way, we will add them to our database (not in the scope of the chapter) and then return a JWT token to continue using our application to the user. For signing up, we will receive the user and password from the client. In this example, we will map the POST call to /signup to this functionality.

We will do it this way:

import express from 'express';
import bodyParser from 'body-parser';
import Authentication...