Еable of contents
- Strengthen skills in React and Vite development
- Practice writing clean, typed code using TypeScript
- Learn to use automation tools (ESLint, Prettier, Husky, lint-staged)
- Configure a modern development environment for frontend projects
- Prepare for teamwork and collaborative coding
Link to layout:
https://www.figma.com/design/
Link to project: https://github.com/internMichael-JS/eCommerce-Application/
-
npm run dev– Starts the development server using Vite. -
npm run build– Compiles TypeScript and builds the project for production. -
npm run preview– Previews the production build locally. -
npm run lint– Runs ESLint to analyze code for problems. -
npm run lint:fix– Automatically fixes linting errors using ESLint. -
npm run format– Formats all files using Prettier. -
npm run format:check– Lists files with formatting differences (without applying changes). -
npm run stylelint– Checks all CSS and SCSS files for style issues. -
npm run stylelint:fix– Automatically fixes style issues in CSS and SCSS files. -
npm run prepare– Prepares the project for Husky Git hooks. -
npm run test– Run tests using Vitest. -
npm run precommit– Run lint-staged before commit.
-
Clone the repository:
git clone https://github.com/internMichael-JS/eCommerce-Application.git cd eCommerce-Application -
Install dependencies:
npm install -
Create
.envfile:CTP_API_URL=https://api.europe-west1.gcp.commercetools.com -
Run in development mode:
npm run dev -
Build for production:
npm run build -
Preview build locally:
npm run preview
- Subscribe to Composable Commerce.
- In the Merchant Center, click Settings > Developer settings.
-
On the API clients tab, click Create new API client:
- Enter a name for your API client.
- Select the scopes for your API Client.
- Click Create API client.
- From the drop-down, select Environment Variables (.env) and click the download icon.
- Add the downloaded
.envfile to the project.