Pragmatic web application toolkit

Installs: 4

Dependents: 0

Suggesters: 0

Security: 0

Stars: 4

Watchers: 1

Forks: 0

Open Issues: 14

Language:Astro

Type:project

0.6.2 2023-11-10 17:35 UTC

This package is auto-updated.

Last update: 2025-06-06 22:35:41 UTC


README

Web application development kit

Darkwave is a "batteries-included" tool kit for building data-driven web applications with Astro.

We've curated a selection of reliable and approachable tools to create a professional-grade full-stack boilerplate with pre-wired functionality and components for common SaaS and CRUD features.

DW facilitates a hyper-productive development workflow, helping developers focus on delivering real value with ease.

Read the full documentation and user guide at darkwave.ltd

What's Included?

Core Stack

Additional Utilities

  • Alpine.js - JavaScript framework for enhanced interactivity
  • HTMX - Modern approach to dynamic content without writing JavaScript
  • Cropper.js - Image cropping library
  • Dropzone - Drag & drop file upload interface
  • SortableJS - Drag & drop sorting library
  • Validator.js - String validation
  • Iconify - Icon framework with Tabler icons set

Core Philosophy

  • Security and performance as top priorities
  • Professional, maintainable solutions without unnecessary complexity
  • Code that is easy to understand and maintain over clever solutions
  • Proven, stable patterns over bleeding-edge features
  • Long-term maintainability and reliability
  • Pragmatic solutions using "boring" techniques

Features

Infrastructure

  • Server-side rendering with Astro and Node.js adapter
  • TypeScript support with enhanced type safety
  • Tailwind CSS with FlyonUI theme integration
  • Better-Auth authentication system with role-based access control and OAuth configured with Google login
  • MySQL database integration with Kysely query builder
  • Comprehensive security configurations (CSP, CSRF protection)

Form Components

  • Text input fields with validation
  • Single and gallery photo upload with cropping
  • Select dropdown
  • Checkbox group
  • Submit and delete buttons with form validation
  • Textarea inputs

UI Components

  • Configurable alert system
  • Modal dialogs
  • Button links

Backend Architecture

  • JWT-based authentication middleware
  • Secure cookie handling
  • Role-based authorization system
  • CSRF protection middleware
  • Email notifications TSX components
  • File upload handling with image processing (integrated with bunny.net cdn & image processor)
  • Configurable environment variables
  • Database schema management

Developer Ergonomics

  • Alias imports (@/ path resolution)
  • Organized project structure
  • Type definitions for enhanced IDE support
  • Development mode conveniences (local cookie handling)
  • Clear coding standards and best practices

Getting Started

Clone the repository

npx degit jyoungblood/darkwave my-project
cd my-project

Install dependencies

npm install

Configure environment variables (add your database, mail server, etc)

mv .env.example .env

Initialize the database

npx @better-auth/cli migrate

Start development server

npm run dev

Refer to the documentation for next steps.

Project Structure

src/
├── components/        # Reusable UI components
│   ├── admin/         # Admin components
│   ├── forms/         # Form-related components
│   └── ui/            # General UI components
├── config/            # Application configuration
├── email-templates/   # Email templates
├── layouts/           # Page layouts
├── lib/               # Shared utilities and helpers
├── middleware/        # Request middleware
├── pages/             # Application routes & templates
├── styles/            # Tailwind & FlyonUI integration, base component styles

License

This project is licensed under the MIT License - see the LICENSE file for details.

* . · : · . ☽ ✧