If you generated a Phoenix app with the --no-brunch option you probably needed an API backend app.
What if, with your app growing, you realize you’d like to add also some frontend code? This short how-to will show you how integrate a Webpack based app with support to Typescript, React and Sass.
In the first part of this post I’ve shown how to configure the API server to let the user authenticate, return an authentication token, and request it to access protected routes. Now I’m going to configure a React app to consume that API and manage authentication. The app uses React Router to manage routes and Redux for the state of the app. Protect private routes I’m going to define a PrivateRoute component as a wrapper around Route.
Scenario: you just wrote a cool web app using React for the frontend part and Phoenix as the API server. Then you realize everybody can poke around your stuff and you decide it’s time to restrict the access to known users, how to do it? I’ll configure a Phoenix server to manage access tokens, used by a React app to make authenticated calls. This blog post only deals with the backend part and consists of these steps: