# How-to-Dev > Source: > Published: 2026-08-30 01:44:12+00:00 # How to Dev This site documents, for real, the standards I use day to day to structure a project from scratch: folder organization, authentication, forms, tables, report exports, and — above all — security, always with the reasoning behind the decision, not just the "how". It isn't a product and there's no team behind it: it's a personal technical reference, published because documenting is the most honest way to check, later, whether a pattern still holds up. It started from a simple question: if a malicious actor got access to this documentation, would it help them attack a real system — or would it show them the system is already protected enough that it isn't worth trying? The [Security](/padrao-frontend/seguranca) section, inside the Frontend Standard, was written with that exact bar: complete documentation, hiding no threshold, header, or authorization behavior. The only acceptable "flaw" is the system being too well protected. ## HTD indexes Use these entry points to jump straight to a subject: pick a topic, open the reference page, then read the implementation notes and checklist. ## Security coverage map A quick way to go from a risk category to the HTD page that actually implements the control — this table reflects HTD's own content, not an external checklist. | Risk or control | HTD reference | |---|---| | Access control and IDOR | | [XSS and input sanitization](/padrao-frontend/seguranca/xss)[Authentication and JWT](/padrao-frontend/seguranca/jwt)[HTTP headers and CSP](/padrao-frontend/seguranca/cabecalhos-de-seguranca-http)[PDF and export security](/padrao-frontend/seguranca/seguranca-exportacao)[Audit logs](/padrao-frontend/seguranca/logs-de-auditoria)## Study roadmap Goes from the basics to the more advanced parts of the standard, in the order I'd actually recommend reading them — each step links straight into the real Frontend Standard content that exists today. - 01 [Foundation](/padrao-frontend)AvailableStart here: what the standard is for, and how the App Router shapes routes and folders. - Overview and project structure - Routing — App Router, folders, private/public routes - 02 [Core web concepts](/padrao-frontend/conceitos-tecnicos)AvailableThe fundamentals every other page assumes: how rendering, caching, and the browser actually behave. - SSR, hydration, and code-splitting - CORS, BFF, and state management - Accessibility and progressive enhancement - 03 [Building the UI](/padrao-frontend/componentes)AvailableTurn concepts into screen: reusable components and the styling decisions behind them. - Buttons, search, filters, and typed props - Modals, select, pagination, and typography - 04 [Data and forms](/padrao-frontend/formularios)AvailableHow data actually moves: forms, validation, caching, and the request/response lifecycle. - Forms with React Hook Form + Zod - Cache, mutations, and query responses (TanStack Query) - File uploads/downloads and PDF/Excel reports - 05 [Security checklist](/padrao-frontend/seguranca)AvailableSecurity as implementation work, not a final review — the most detailed section on HTD. - XSS, CSRF, JWT, IDOR, and RBAC - HTTP headers, CSP, and cookie handling - Password policy, brute force, and audit logs - 06 [API, infrastructure, examples](/examples)In progressThe parts that expand the same standard beyond the frontend — not written yet. - API Standard — HTTP contract, pagination, versioning - Infrastructure Standard — environments, deploy, observability - Examples — complete reference flows ## Project links ## About me I'm Juan Kalleo, a Staff Fullstack Software Engineer on NextTech's frontend team, based in Porto Velho, Brazil. Secure software development is the focus that runs through most of what I build — HTD is where that focus turns into documentation, written the way I wish more of it was. [GitHub ↗](https://github.com/juankalleo)