<<<<<<< HEAD

Welcome to your shiny new Codespace running React! We've got everything fired up and running for you to explore React.

You've got a blank canvas to work on from a git perspective as well. There's a single initial commit with the what you're seeing right now - where you go from here is up to you!

Everything you do here is contained within this one codespace. There is no repository on GitHub yet. If and when you’re ready you can click "Publish Branch" and we’ll create your repository and push up your project. If you were just exploring then and have no further need for this code then you can simply delete your codespace and it's gone forever.

This project was bootstrapped for you with Vite.

In the project directory, you can run:

We've already run this for you in the Codespaces: server terminal window below. If you need to stop the server for any reason you can just run npm start again to bring it back online.

Runs the app in the development mode.
Open http://localhost:3000/ in the built-in Simple Browser (Cmd/Ctrl + Shift + P > Simple Browser: Show) to view your running application.

The page will reload automatically when you make changes.
You may also see any lint errors in the console.

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

You can learn more in the Vite documentation.

To learn Vitest, a Vite-native testing framework, go to Vitest documentation

To learn React, check out the React documentation.

This section has moved here: https://sambitsahoo.com/blog/vite-code-splitting-that-works.html

This section has moved here: https://github.com/btd/rollup-plugin-visualizer#rollup-plugin-visualizer

This section has moved here: https://dev.to/hamdankhan364/simplifying-progressive-web-app-pwa-development-with-vite-a-beginners-guide-38cf

This section has moved here: https://vitejs.dev/guide/build.html#advanced-base-options

This section has moved here: https://vitejs.dev/guide/build.html

// ...existing code...

A small React + Vite starter that demonstrates a product listing page with search, sort and filters. Uses Tailwind CSS for styling and Faker to generate demo data.

• App and UI: App — main UI, reducer logic is defined there as reducer and initialState.
• Demo data: data — Faker-generated product list.
• Entry: index.jsx and template index.html.
• Styles: index.css (Tailwind import).
• Vite config & test runner: vite.config.js.
• Tests: App.test.jsx and test setup setupTests.js.
• Perf helper: reportWebVitals.
• PWA manifest & robots: public/manifest.json, public/robots.txt.
• Dev container: .devcontainer/devcontainer.json (auto-starts the app and forwards port 3000).
• VS Code launch: .vscode/launch.json.
• Project metadata: package.json.
• License: LICENSE.

• Search by product name.
• Sort by price (low → high, high → low).
• Filters: in-stock only, fast delivery only.
• Demo data seeded for deterministic results via Faker.

Prerequisites: Node.js (recommended via devcontainer if used).

Install dependencies:

npm install

Run development server (Vite) on port 3000:

npm start

Open the app in the host browser (from the devcontainer environment):

$BROWSER http://localhost:3000

Build for production:

npm run build

Preview production build:

npm run preview

Run tests (Vitest + Testing Library):

npm test

The devcontainer defined in .devcontainer/devcontainer.json runs npm install on update and forwards port 3000. It also opens src/App.jsx on start and attempts to start the app automatically.

• Tailwind is included via index.css and the plugin in vite.config.js.
• Faker seeding in src/data/index.js ensures reproducible demo data.
• Tests use JSDOM as configured in vite.config.js.

• If the dev server doesn't appear, confirm no process is already using port 3000.
• If images from Faker fail to load, they are placeholder URLs; network restrictions may block them.

Small example — open a PR with improvements. Keep UI and reducer logic inside App.

This project is MIT licensed — see LICENSE.

414979d (feat: initialize React project with Vite and Tailwind CSS)