Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Byrontosh/FundamentosReact/llms.txt

Use this file to discover all available pages before exploring further.

In this guide you’ll get Fundamentos React running on your local machine. Once the dev server is up you’ll have an interactive, sidebar-driven app that walks through core React concepts — components and JSX, useState, useEffect, custom hooks, props, Zustand global state, conditional rendering, and localStorage persistence — each on its own dedicated route.
1

Clone the repository

Clone the project from GitHub and move into the project directory.
git clone https://github.com/Byrontosh/FundamentosReact.git && cd FundamentosReact
2

Install dependencies

Install all required packages using your preferred package manager.
npm install
The project uses React 18, React Router v7, Zustand v5, and Tailwind CSS v4 (loaded via the @tailwindcss/vite plugin). All are listed in package.json and will be resolved in one install step.
3

Start the dev server

Launch the Vite development server.
npm run dev
Vite will start and print a local URL. Open it in your browser:
http://localhost:5173
Hot module replacement (HMR) is enabled by default — changes to any source file are reflected in the browser instantly without a full reload.
4

Navigate the app

Once the app loads you’ll land on the Fundamentos page. A sidebar on the left lists every concept covered by the project. Click any link to jump directly to that topic’s interactive demo page.
Sidebar linkRouteConcept covered
Fundamentos/fundamentosReact components & JSX basics
useState/usestateLocal state with useState
useEffect/useffectSide effects with useEffect
Custom Hook/customhookExtracting logic into custom hooks
Props/propsPassing data between components
Zustand/zustandGlobal state management with Zustand v5
Renderizado/rederizadoConditional & list rendering
localStorage/localStoragePersisting state with the Web Storage API
Each page contains live, editable examples so you can experiment directly in the browser.

​
Available scripts

The following scripts are defined in package.json and can be run from the project root.
ScriptCommandDescription
Dev servernpm run devStarts the Vite development server on http://localhost:5173 with HMR enabled.
Production buildnpm run buildBundles the app for production into the dist/ directory.
Preview buildnpm run previewServes the production build locally so you can verify the output before deploying.

​
Project entry point

The application mounts from src/index.jsx. It wraps the root <App /> component in React.StrictMode and attaches it to the #root <div> declared in index.html.
src/index.jsx
import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App'
import './index.css'

ReactDOM.createRoot(document.getElementById('root')).render(
	<React.StrictMode>
		<App />
	</React.StrictMode>
)
This project was originally scaffolded on Replit. As a result, vite.config.js contains a server.allowedHosts entry pointing to a Replit preview URL:
vite.config.js
server: {
  allowedHosts: ['98e93ea5-9538-4ff9-9373-c75809af2597-00-3tonq8itozctu.picard.replit.dev']
}
This entry is harmless but unnecessary when running locally. You can safely remove the entire server block from vite.config.js if you want a clean local config.

Build docs developers (and LLMs) love

Get started for freeTalk to us