Introduction to Nalth
Welcome to Nalth, the security first web framework built on Vite.
Nalth is not just another build tool. It is a complete rethinking of how we approach web development in an era where security can no longer be an afterthought. Built on the solid foundation of Vite.js, Nalth extends what you already know and love with enterprise grade security features that work automatically.
Installation
The best way to start with Nalth is using the create command. This will set up a new project with all the default security configurations in place.
npm create nalth@latest my-secure-appYou can also use Yarn, pnpm, or Bun:
yarn create nalth my-secure-apppnpm create nalth@latest my-secure-appbun create nalth@latest my-secure-appAlready have a Vite project? You can add Nalth incrementally:
npm install -D nalthQuick Start
Get your secure application running in less than a minute.
1. Create your project
Run the creation command and select your preferred template.
npx create-nalth@latest my-app2. Start the server
Navigate into your project and start the development server. Notice that it runs over HTTPS by default.
cd my-app
npm install
npm run dev3. Build for production
When you are ready to ship, build your application. Nalth will automatically optimize your assets and generate security headers.
npm run buildZero Config
"Zero Config" means sane defaults. We believe you shouldn't have to be a security expert to build a secure app. Out of the box, Nalth handles:
- Automatic HTTPS setup for localhost (using mkcert)
- Strict Content Security Policy (CSP) generation
- Subresource Integrity (SRI) hashing
- Secure HTTP headers (HSTS, X-Frame-Options, etc.)
- Vulnerability scanning of dependencies
However, "Zero Config" doesn't mean "No Config". When you need to customize behavior (e.g., allowing a specific third-party script in your CSP), you can create a nalth.config.ts file.
import { defineConfig } from 'nalth'
export default defineConfig({
security: {
csp: {
directives: {
'script-src': ['self', 'https://analytics.google.com']
}
}
}
})Why Nalth Exists
Modern web development has become incredibly fast and efficient, thanks to tools like Vite. But as we have optimized for speed and developer experience, security has often been left as a manual checklist item that developers need to remember. Content Security Policies that need manual configuration. HTTPS certificates that require setup. Security headers that you need to look up and add one by one.
We built Nalth because we believe security should be automatic. Not because developers are careless, but because in the complexity of modern applications, it is too easy for critical security configurations to be missed or misconfigured. A single forgotten header or misconfigured CSP can expose your users to serious vulnerabilities.
The Philosophy
Nalth operates on three core principles that guide every decision we make:
Security by Default
Every new Nalth project starts with enterprise grade security already configured. HTTPS with automatically generated certificates. Content Security Policies that protect against XSS attacks. Security headers that prevent clickjacking and other common exploits. You get all of this without writing a single line of configuration.
Zero Breaking Changes
If you know Vite, you know Nalth. Every Vite configuration option works exactly as documented. Every Vite plugin works without modification. Your existing vite.config.ts can be renamed to nalth.config.ts and everything continues to work. We add security features on top of Vite, never replacing or modifying its core functionality.
Developer Experience First
Security tools have a reputation for being difficult to use and slowing down development. Nalth takes the opposite approach. Our security features are designed to be invisible during development, only surfacing when they protect you from an actual issue. Configuration is optional but powerful when you need it. Error messages are clear and actionable.
What You Get
When you choose Nalth, you are getting much more than a build tool. You are getting a complete security framework that has been battle tested in production environments. Here is what comes built in:
HTTPS Everywhere
In development, Nalth automatically generates locally trusted SSL certificates using mkcert. No browser warnings. No manual certificate installation. Just add your server and everything works over HTTPS from day one. In production, you get recommended configurations for popular hosting platforms that ensure your SSL setup is optimal.
Intelligent Content Security Policy
CSP is one of the most powerful security features available to web applications, but it is also one of the most complex to configure correctly. Nalth watches your application during development and automatically generates a CSP that allows your code to run while blocking potential XSS attacks. It uses nonce based script execution, automatically managing nonces across development and production builds.
Comprehensive Security Headers
X-Frame-Options, X-Content-Type-Options, Strict-Transport-Security, Referrer-Policy, Permissions-Policy. All of these headers and more are automatically configured with secure defaults. You can override any of them if needed, but for most applications, the defaults provide excellent protection.
Subresource Integrity
Every script and stylesheet that your application loads gets an SRI hash automatically generated during the build process. This ensures that if a CDN is compromised or a file is tampered with, browsers will refuse to execute the malicious code.
Real Time Vulnerability Scanning
Nalth monitors your dependencies for known vulnerabilities and alerts you immediately when issues are discovered. Unlike periodic scans, this happens in real time during development, giving you the earliest possible warning about potential security issues in your supply chain.
npm install nalth