GOAT Portfolio is a modern SaaS platform built for developers and professionals who want a polished, shareable presence on the web — without building one from scratch. Sign up, fill in your projects and skills, pick a template, and walk away with a live portfolio URL you can put on your résumé or LinkedIn profile today.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/giangartun/Tis-GOAT-Frontend/llms.txt
Use this file to discover all available pages before exploring further.
What is GOAT Portfolio?
GOAT Portfolio is a single-page application (SPA) built with React 19 and TypeScript, communicating with a dedicated REST API over JSON. Everything your visitors see — project cards, skill badges, work-history timelines — is fetched at runtime and rendered client-side. Key platform highlights:- Three portfolio templates — choose the layout that matches your personal brand:
- Bento — a grid-based, magazine-style layout
- Sidebar — a classic two-column layout with persistent navigation
- Editorial — a clean, content-first vertical layout
- JWT authentication — every authenticated request carries a Bearer token stored in
localStorage, automatically injected by the Axios interceptor insrc/Services/api.ts. - Privacy controls — decide who can view your portfolio: public, link-only, or private.
- Admin panel — platform administrators can manage user accounts from a dedicated
/admin/usuariosroute. - Internationalisation — the UI is fully localised via
react-i18next, making it ready for multilingual audiences.
GOAT Portfolio is a frontend-only repository. It expects a running backend
API reachable at the URL configured in
VITE_API_URL. See the
Configuration page for details.Core concepts
Portfolio
Every user account is paired with exactly one portfolio record. It stores
your chosen template (
id_plantilla), visibility setting, and public URL
slug. All other content hangs off this root object.Projects
Projects are the centrepiece of your portfolio. Each project has a name,
description, start date, and an optional array of
tecnologias (technology
tags) that render as skill badges on your public page.Skills
Skills are standalone entries (separate from project technology tags) that
let you highlight proficiencies — languages, frameworks, tools — with
individual ratings or categories.
Experience
Work-history and education records that appear in chronological order on
your public portfolio. Each entry carries a title, organisation, date range,
and description.
Privacy Controls
The
/privacidad route lets you toggle your portfolio between public
(indexed, anyone can view), link-only (accessible by direct URL only),
and private (visible only to you when logged in).Admin Panel
Platform admins access
/admin/usuarios to view, suspend, or delete user
accounts. This route is protected server-side; non-admin tokens receive a
403 Forbidden response.Architecture overview
GOAT Portfolio’s frontend is deliberately thin — it is a pure presentation and interaction layer that delegates all business logic to the backend API.| Layer | Technology | Version |
|---|---|---|
| UI framework | React | 19.x |
| Language | TypeScript | ~5.9 |
| Build tool | Vite | 8.x |
| Styling | Tailwind CSS | 3.x |
| Routing | react-router-dom | 7.x |
| HTTP client | Axios | 1.x |
| Internationalisation | react-i18next / i18next | 17.x / 26.x |
| Icons | lucide-react | 1.x |
react-router-dom v7 with a BrowserRouter wrapping two route groups: routes that render inside the shared <Layout> component (authenticated pages), and bare routes that render full-screen (login, register, email verification, admin panel).
HTTP requests all flow through the shared api Axios instance defined in src/Services/api.ts. A request interceptor automatically reads the JWT from localStorage and attaches it as an Authorization: Bearer <token> header. The base URL is ${VITE_API_URL}/api.
Next steps
Quickstart
Register, verify your email, create your first project, and publish your
portfolio in five steps — takes under five minutes.
Authentication guide
Deep-dive into JWT login flow, token refresh, password reset, and protecting
routes on the frontend.
Portfolio guide
Customise your template, add social links, manage privacy settings, and
preview your public profile.
API overview
Browse every REST endpoint exposed by the backend: request shapes, response
schemas, and error codes.