Pre-Deployment Setup

Configure your Tienda ETCA application for production deployment

Overview

Before deploying Tienda ETCA to production, you need to configure your build environment and ensure all dependencies are properly set up.

Prerequisites

1. Node.js Installation

   Ensure you have Node.js installed (version 18 or higher recommended):

   node --version
   
2. Install Dependencies

   Install all required dependencies from the project root:

   npm install
   

   This will install all production and development dependencies including:

   • React 19.0.0
   • Vite 6.3.1
   • React Router DOM
   • Bootstrap and React Bootstrap
   • Additional UI libraries (React Icons, SweetAlert2, React Toastify)

Vite Configuration

The application uses Vite as the build tool with a minimal configuration:

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
})

The default Vite configuration is sufficient for most deployment scenarios. Vite automatically optimizes the build for production.

Environment Variables

Never commit environment files (.env, .env.local, .env.production) to version control. These may contain sensitive information.

If your application requires environment variables:

1. Create a .env.production file in the project root
2. Add variables with the VITE_ prefix to make them accessible in your app:

VITE_API_URL=https://api.example.com
VITE_APP_NAME=Tienda ETCA

3. Access them in your code:

const apiUrl = import.meta.env.VITE_API_URL

Build Verification

Before deploying, verify that your application builds successfully:

npm run build

This will create an optimized production build in the dist/ directory.

The build process includes:

• JavaScript bundling and minification
• CSS optimization
• Asset optimization
• Tree-shaking to remove unused code

Production Testing

Test the production build locally before deploying:

npm run preview

This starts a local server to preview your production build, typically at http://localhost:4173.

Next Steps

Once your setup is complete and verified:

• Proceed to Building for Production
• Choose your Hosting Platform