N
Nexo
← Back to dashboard
Documentation

Nexo v1.0

Everything you need to install, customize and extend the template. The full, file-by-file version of this documentation ships in the docs/ folder of the download.

Installation

Requirements: Node.js ≥ 20.9 and npm. No database, no environment variables — the template has no backend.

npm install
npm run dev   # http://localhost:3000
npm run build  # production build

Other scripts: npm run lint, npm test, npx tsc --noEmit. See docs/01-instalacion.md for troubleshooting notes.

Project structure

src/app/ holds the routes (two route groups: (admin) for the 46 pages with sidebar/topbar, (auth) for the 12 standalone pages) and the global stylesheets. src/components/ holds every reusable piece, organized by category (cards, table, forms, ui, charts, overlays, layout, pages). src/lib/ holds the page inventory, the sidebar navigation tree and the icon set.

Full breakdown, including where to edit each thing, in docs/02-estructura.md.

Components

Every reusable building block, with a usage example, is catalogued in docs/03-componentes.md. Quick index:

Cards
Card, CardHeader, CardBody, CardFooter, StatCard, StatusBadge, ProjectCard, ContactCard
Table
DataTable — sort, search and pagination, no external table library
Forms
Switch, TagInput, MultiSelect, Rating, Stepper, Slider, OtpInput, DateRangePicker, Wizard, PasswordField, ColorGrid, Dropzone, FileInputCompact, AvatarUpload, RichTextEditor
UI
Avatar, AvatarStack, Accordion, Drawer, Popover, Toggle, Timeline
Charts
EChart (Apache ECharts wrapper, theme-aware) + 19 ready-made option factories
Overlays
ToastProvider/useToast, ModalProvider/useModal, MenuProvider/useMenu — mounted once app-wide, used via hooks

Theming

Every color, spacing and radius value is a CSS custom property in src/app/globals.css (light tokens under :root, dark overrides under [data-theme='dark']). Change --primary/--primary-lt/--primary-dk to rebrand the whole app — buttons, links, charts and the active sidebar item all read the same variable.

:root {
  --primary: #4263eb;
  --primary-dk: #2747c4;
}

Try colors live without touching code on the Theme generator page. Dark mode is attribute-based (<html data-theme="dark">) with a pre-paint script so there is no flash on load. Full guide in docs/04-temas.md.

Pages (58)

General
Dashboards, Forms, Tables, Charts, Calendar, Map
17 pages
Apps
Chat, Inbox, Kanban, Files, Notifications
5 pages
E-commerce
Storefront, Product, Orders, Invoice, Pricing
6 pages
Projects
All projects, Project detail
2 pages
UI library
Elements, Widgets, Playground, Theme generator, Typography, Icons, Media
7 pages
Admin
Contacts, User management, Profile, Settings, Help center
5 pages
Layouts
Fixed sidebar, Fixed footer, Nested page, Blank
4 pages
Auth / errors / marketing
Login, Register, 2FA, Lock screen, 403/404/500, Maintenance, Offline, Landing, Coming soon
12 pages

Full list with routes in docs/05-paginas.md.

Changelog

Nexo v1.0 — initial release. 58 pages across dashboards, forms, tables, charts, calendar, kanban, inbox, chat, file manager, e-commerce, projects, an admin/UI kit, and a full auth/error/marketing set, plus a global ⌘K command palette. Full development history in docs/CHANGELOG.md.