https://github.com/s3ak/fed1-js1-jackets-e-commerce-site-vanilla
Created with StackBlitz ⚡️
https://github.com/s3ak/fed1-js1-jackets-e-commerce-site-vanilla
ecommerce-website static-site vanilla-css vanilla-javascript
Last synced: about 1 year ago
JSON representation
Created with StackBlitz ⚡️
- Host: GitHub
- URL: https://github.com/s3ak/fed1-js1-jackets-e-commerce-site-vanilla
- Owner: S3ak
- Created: 2025-02-04T10:48:53.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-04T10:15:44.000Z (over 1 year ago)
- Last Synced: 2025-05-19T00:16:23.816Z (about 1 year ago)
- Topics: ecommerce-website, static-site, vanilla-css, vanilla-javascript
- Language: JavaScript
- Homepage: https://stackblitz.com/edit/vitejs-vite-yvbd79yj
- Size: 188 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# fed1-js1-jackets-e-commerce-site-vanilla
[Edit in StackBlitz next generation editor ⚡️](https://stackblitz.com/~/github.com/S3ak/fed1-js1-jackets-e-commerce-site-vanilla)
## Project Assets
- [Stackblitz](https://stackblitz.com/~/github.com/S3ak/fed1-js1-jackets-e-commerce-site-vanilla)
- [Production deploy](https://outerdimensionaldrip.vercel.app/)
- [Staging deploy](https://outerdimensionaldrip.netlify.app)
- [staging Deployment Dashboard](https://app.netlify.com/sites/outerdimensionaldrip/overview)
- [Production Deployment Dashboard](https://vercel.com/monde-sinekes-projects/outerdimensionaldrip)
- [Design Doc](https://www.figma.com/board/thVST2qvAmfqEFS3JjU3GU/FED-JS1-Jackets-E-commerce-website?node-id=0-1&t=MmdtghNgkkem48SX-1)
- [Lo-Fi Design Spec]()
- [Hi-Fi Design Spec]()
- [API URL](https://docs.noroff.dev/docs/v2/e-commerce/rainy-days)
- [Analytics dashboard](#TODO:@Mo)
- [TODOS](https://github.com/S3ak/fed1-js1-jackets-e-commerce-site-vanilla/issues)
## Tech Stack
- [Vite](https://nextjs.org/)
- [Animate CSS](https://animate.style/)
- [Open Props](https://open-props.style/)
- [Storybook](https://storybook.js.org/)
- [Cypress](https://www.cypress.io/)
- [Luxon](https://moment.github.io/luxon/#/)
- [Font Awesome](https://fontawesome.com/search?ic=free)
- [Prettier](https://prettier.io/) - An opinionated code formatter
- [Eslint](https://eslint.org/) - Find and fix problems in your JavaScript code
## Resources
## Project leads
- Monde Sineke: - Technical lead
## Features
- SEO friendly #TODO
- Responsive #TODO
- Prebuilt components #TODO
- E2E testing with every pull request #TODO
## Enviroments
There are two enviroments.Pr
### production
Production is the enviromewnt the end-user experience. This is the final product that will be deployed to the public. This enviroment is hosted on Vercel.
### staging
Staging is the enviroment where the team can test the latest features and bug fixes. This enviroment is hosted on Vercel.
## Getting Started
Quick Start
- Checkout using VScode
- press *F1* and type `git:clone`
- Install packages
- press *F1* and type `run task` and hit enter.
- type `npm` and hit enter.
- type `install` and hit enter.
- press *F5*
1 Install all the dependencies:
```bash
npm install
```
2 Checkout from staging to a new branch:
```bash
git checkout -b feature/your-name-feature
```
3 run the development server:
```bash
npm run dev
```
Forth. Open up cypress to see that you have not broken anything:
```bash
npm run test:e2e:open
```
Fifth. Open up storybook to start developing your component:
```bash
npm run storybook
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
## Minimum acceptence criteria
Please see issues tab.
## Deploy on Vercel
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.