React Typescript Starter Project

This is a ReactJS TypeScript Starter Project for building dynamic web applications with a focus on modern front-end technologies. This project features dedicated Login and SignUp pages, ensuring a secure and seamless onboarding experience. Leveraging React Router V6, the application implements efficient routing, enhancing the overall user navigation experience. Centralised Store Management is achieved through Redux, providing a unified and organised approach to state management. The Nabber and Sidebar components offer an intuitive and aesthetically pleasing interface for users to navigate through the application seamlessly. In addition to user authentication, the project incorporates a TODO App, showcasing practical implementation and integration of dynamic components. This starter project serves as an excellent foundation for developers looking to kickstart their ReactJS and TypeScript projects, providing a structured architecture with essential features for a modern web application.

Features

• Login and SignUp Pages
• Routing Implemented using React Router V6
• Centralized Store Management by Using Redux
• Navbar and Sidebar Implemented
• TODO App Implemented
• TailwindCSS for responsive styling

❯ Table of Contents

• Quick Start
• Project Structure
• Yet To Be Implemented
• References

Quick Start

Start the Project with the following Command

npm start

Project Structure

The folders under the src folder are listed as follows

• assets - Contains any kind of assets like images,svg,global css
• components - All the share components will be inside this folder
• context - Any kind of context
• data - Any kind of constants or store json
• hooks - All the hooks that is there for the application
• pages - All the unique pages will come up here. The actual pages
• utils - All the utility files. Small and simple pure functions
• store - The redux store data
• layouts - This is for layouts like Nav bar, headers, footers etc.
• lib - The external library that we use. Like Axios, Faced Pattern. Faced put over any library
• services - Different Services like API or graphql
• routes - The centralized route files
• features - Contains certain features and its relevant files

Yet To Be Implemented

• Backend Calls
• Login and Registration Validation

References

How to Use Redux and Redux Toolkit – Tutorial for Beginners