nmtechsolutionstuc/dinaxtech

Purpose and Delivery Model

DINAX TECH is a static Spanish-language marketing landing page for a mobile-accessories and technology retailer in San Miguel de Tucumán. It has no backend, database, authentication, or server-side business logic. The production artifact is Vite’s static dist/ output, suitable for Vercel or Render Static Site deployment.

Runtime and Entry Points

The application runs in the browser as a React single-page application:

• HTML document and root mount point: index.html

• JavaScript bootstrap that mounts React: src/main.jsx

• Main page composition and content source: src/App.jsx

Node.js 18+ is required only for dependency installation, development, and builds. Vite provides the development server, bundling, and production build behavior through vite.config.js.

Page Composition and Content Boundary

src/App.jsx is the central architecture boundary: it contains both the page component tree and the business-facing content model. Content is organized in constants such as categories, products, benefits, WhatsApp contact data, and social links, then rendered into landing-page sections.

This makes content updates primarily a source-edit workflow rather than CMS- or API-driven. There is no remote product catalog, inventory synchronization, checkout flow, or persistence layer.

Customer Interaction Flow

The primary visitor flow is:

1. Load the branded landing page.

2. Browse category, product, and benefit content rendered by src/App.jsx.

3. Follow calls to action toward direct contact, especially WhatsApp, or social destinations.

4. Leave the static site for external communication/social platforms when those links are selected.

Contact and social URLs are configured locally in src/App.jsx; those external destinations are the main integration boundary.

Presentation Layer

Traditional CSS owns visual identity, layout, responsiveness, and any lightweight animations:

• Global styling and design tokens: src/styles.css

• Component markup/class usage: src/App.jsx

Brand colors are defined as CSS custom properties near the start of src/styles.css. There is no component library, CSS framework, or animation library, so page appearance is tightly coupled to the local stylesheet and JSX class structure.

Static Assets and Browser Shell

Publicly served assets live under public/, including the browser favicon:

• public/favicon.svg

• index.html

index.html is largely infrastructure-facing: it supplies the document shell and Vite entry script, while React controls visible page content after startup.

Build and Hosting Boundary

Package scripts in package.json drive the lifecycle: development server, production build, and local production preview. The deployable boundary is generated output rather than a runtime server:

• Dependency/scripts manifest: package.json

• Vite configuration: vite.config.js

• Generated deployment directory: dist/ (not tracked in the supplied tree)

Vercel and Render are supported as static hosting targets; neither requires application-specific server infrastructure.