React Tutorial: Social Network Demo SPA

This is a learning project created to master React and related technologies. The project is based on the "React - Путь Самурая" course from IT-Incubator. It is a simplified version of a social network, built as a Single Page Application (SPA), where I implemented core features like user authentication, profile management, and post creation. Additionally, I developed a real-time chat feature using WebSocket. I also implemented a paginated user search, allowing users to browse through profiles efficiently.

At its core, the project leverages React and TypeScript, providing a strong foundation for building scalable and type-safe components. To handle routing, I used React Router DOM. For state management, I integrated Redux alongside React Redux, utilizing Redux Thunk for handling asynchronous actions and Reselect for efficient state selection. For forms implementation, I used both Redux Form and Formik, ensuring solid validation and user-friendly interactions. To handle HTTP requests, I relied on Axios, which allowed me to interact with APIs smoothly, and querystring for encoding URL parameters. For generating unique identifiers, I used UUID, while Classnames helped me manage conditional class names in a clean and readable way. The user interface is built with Ant Design. I used Jest alongside React Test Renderer to write unit tests for components and application logic. Finally, I deployed the project using GitHub Pages, making it accessible to anyone who wants to explore the demo.

Throughout the codebase, I have included extensive comments to explain the logic, structure, and purpose of each component, function, and module. These comments are designed to make the code more accessible to other developers, as well as to serve as a learning resource for myself when revisiting the project in the future.

---

Link to the demo

---

Tech Stack

Javascript	NPM	Typescript 4.3.5	Node.js 16.20.2	React 17.0.2	React Router DOM 5.2.0
Redux 4.1.0	React Redux 7.2.4	Redux Thunk 2.3.0	Reselect 4.0.0	Redux Form	Formik 2.2.9
Axios 0.21.1	UUID 8.3.2	Ant Design 4.16.9	Jest 5.14.1	React Test Renderer 17.0.2	GitHub Pages 3.2.3

---

Scripts

Script	Description
npm install	Installs the modules
npm start	Runs the application
npm test	Runs the unit tests
npm run build	Makes a build for GitHub Pages (read index.js before doing that)
gh-pages -d build	Deploys the build to GitHub Pages

---