Ns Cix Sveltekit

MrBloodrune

NS-CIX SvelteKit Website

Natural State Community Internet Exchange - Arkansas's first community-driven Internet Exchange Point.

Overview

This is the official website for NS-CIX, migrated from a static HTML/CSS/JS implementation to SvelteKit for better performance, maintainability, and future scalability.

Migration Status

✅ Initial SvelteKit setup
✅ Core configuration (Vite, PostCSS, Static adapter)
✅ Basic route structure
✅ Style system migration (PostCSS)
⏳ Component migration in progress
⏳ Interactive features migration
⏳ Testing setup

Tech Stack

Framework: SvelteKit with Svelte 5
Styling: PostCSS with CSS variables and modern CSS features
Build Tool: Vite
Deployment: Static adapter for static site generation
Node Version: 20.x recommended

Development

Prerequisites

# Install dependencies
npm install

Available Scripts

# Start development server on http://localhost:3000
npm run dev

# Build for production
npm run build

# Preview production build
npm run preview

# Type check (once svelte-check is installed)
npm run check

# Continuous type checking
npm run check:watch

Project Structure

ns-cix-sveltekit/
├── src/
│   ├── app.html          # HTML template
│   ├── app.pcss          # Global styles entry
│   ├── lib/              # Shared components and utilities
│   │   ├── components/   # Reusable Svelte components
│   │   ├── stores/       # Svelte stores
│   │   └── utils/        # Utility functions
│   ├── routes/           # SvelteKit routes
│   │   ├── +layout.svelte
│   │   └── +page.svelte
│   └── styles/           # Global PostCSS styles
├── static/               # Static assets
├── svelte.config.js      # SvelteKit configuration
├── vite.config.js        # Vite configuration
└── postcss.config.cjs    # PostCSS configuration

Features

Performance: Optimized bundle splitting, lazy loading
Accessibility: WCAG 2.1 AAA compliant
SEO: Static site generation with proper meta tags
Design: Arkansas-themed with cyber aesthetic
Responsive: Mobile-first design approach

Deployment

The site is configured to build as a static site using @sveltejs/adapter-static:

npm run build
# Output will be in the 'build' directory

Environment

OS: AlmaLinux 9.6 (production)
Node: 20.x
Port: 3000 (development)

Contributing

Please ensure all changes maintain:

Accessibility standards (WCAG 2.1 AAA)
Performance budgets
Arkansas blue (#004B87) as primary brand color
Existing SEO structure

License

Top categories