Introduction and Project Setup | Todo App with React, TypeScript, TDD | Frontend Hire

The video covers a comprehensive tutorial on creating a Todo App using React, TypeScript, and Test-Driven Development (TDD) techniques. This is part one of the course includes a good project setup with Vite, TypeScript, ESLint, Prettier, Husky, and Lint Staged.
Update: We have migrated from the Nextra-hosted project to our central platform. You must register to access the course notes now.
Course Notes: www.frontendhire.com/courses/...
Links Referred To In The Video:
Replace Create React App recommendation with Vite: github.com/reactjs/react.dev/...
Excalidraw Repo: github.com/excalidraw/excalidraw
Cal.com Repo: github.com/calcom/cal.com
Chapters
00:00 Introduction
00:43 Why not CRA
02:34 Vite
04:26 Git
04:56 Prettier
09:45 Prettier Editor Integration
12:17 ESLint
13:17 Git Hooks: Husky & Lint-Staged

[@kacperkepinski4990]

great video for setup prettier and eslint

[@FrontendHire]

Glad it helped

[@100xDevPiyush]

Great explanation, from now i will use this setup for all my projects

[@FrontendHire]

Do look at your project requirements before making such a decision. Though most of things remain same irrespective of the framework.

[@kacperkepinski4990]

can i use in vite one command which run many commans like npm ci && npm start?

[@FrontendHire]

Yes, these commands are just scripts. (docs.npmjs.com/cli/v10/using-npm/scripts). You just have to mindful of the order in which you run them. You can set up a script that will run these at once. This article might be helpful: deliciousbrains.com/npm-build-script/

[@kacperkepinski4990]

@@FrontendHire but I mean one command after another

[@FrontendHire]

Yes, you can run them one after the other.

[@kacperkepinski4990]

@@FrontendHire I have do sth like I have to run project after npm ci npm start and npm run storybook and it should be the only way to start project

[@FrontendHire]

Ahaan, I think I understand your query better now. You can chain the commands like this "npm ci && npm start" but you cannot chain the "npm run storybook" right after the "npm start" as npm start would never exit without user interruption and is always running. Ideally, you should run the storybook command and the vite dev server parallel. My suggestion would be to not combine these commands and just open a new terminal for storybook. If I am still not understanding your query, ping me (iamYHR) on Discord at discord.gg/DWAVqksVtx or reach out to me on LinkedIn at www.linkedin.com/in/yarala-hruthik-reddy/