DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 967,611 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for react-ts-starter
Can Umay
Can Umay

Posted on

react-ts-starter

Sometimes as a frontend developer, I want to develop a project which has authentication part but implementing it again and again for every project is boring most of the time.

Therefore, I decided to develop a starter repository for faster development process and I made it open sourced.

If you are using React, Typescript, TailwindCSS, React Router, Axios, React Hook Form and yup you should check my repository.

GitHub logo canumay / react-ts-starter

Starter repository for developers who uses React, Typescript, TailwindCSS, React Router, Axios, React Hook Form and yup.

react-ts-starter

This repository created for developers who uses React, Typescript, TailwindCSS, React Router, Axios, React Hook Form and yup.

Demo

Check this link to see demo.

Installation

This repository requires Node.js and Yarn to run.

yarn install

Development

In the project directory, you can run:

yarn start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

Testing

yarn test

Launches the test runner in the interactive watch mode.

Deployment

yarn build

Builds the app for production to the build folder.

Mock API

I used Reqres as mock api to simulate login & register process.

Screenshots

Login Page

login

Login Page (input validation with React Hook Form and yup)

login-input-validation

Register Page

register

Register Page (input validation with React Hook Form and yup)

register-input-validation

Protected Page

protected

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License

MIT

I'm still React & Typescript learner so if you see issues with my code, pull requests appreciated!

Have a great day!

Top comments (0)

About Real-time

Join DEV and MongoDB to build a front-end application using MongoDB Atlas. Change streams to display live updates as your database changes for your entry in the DEV x MongoDB Atlas Hackathon 2022.

β†’ Join the Hackathon