Contact Refresh - Pure HTML + Tailwind 4.1 Project

🔗 Лендинг — tokenbel.info | Агрегатор токенов — dashboard.tokenbel.info

Project Overview

This project has been successfully migrated from a React + Vite + TypeScript setup to a pure HTML + Tailwind CSS 4.1 static site.

Project Structure

/
├── public/ # Static assets and additional HTML pages
│ ├── contacts.html # Contact page
│ ├── favicon.ico # Favicon
│ └── ... # Other static assets
├── index.html # Main HTML file
├── vite.config.ts # Vite configuration
├── tailwind.config.ts # Tailwind CSS configuration
├── postcss.config.js # PostCSS configuration
└── package.json # Project dependencies

Technologies Used

• Vite - Fast build tool and development server
• Tailwind CSS 4.1 - Utility-first CSS framework (via CDN)
• Alpine.js - Lightweight JavaScript framework for interactivity
• HTML5 - Pure HTML structure

Getting Started

Prerequisites

• Node.js (v18+) or Bun
• npm, yarn, pnpm, or bun

Installation

# Clone the repository
git clone <repository-url>
cd contact-refresh
# Install dependencies
bun install
# or
npm install
# or
yarn install
# or
pnpm install

Development

# Start development server
bun run dev
# or
npm run dev
# Server will start at http://localhost:8080

Building for Production

# Build for production
bun run build
# or
npm run build
# Preview production build
bun run preview
# or
npm run preview

Project Features

✅ Pure HTML + Tailwind CSS - No React dependencies

✅ Fast build times - Vite-powered optimization

✅ Responsive design - Mobile-first approach

✅ Easy to maintain - Simple file structure

✅ Production ready - Optimized assets

Available Pages

• Home Page (index.html) - Main landing page
• Contact Page (public/contacts.html) - Contact form and information

Customization

Adding New Pages

1. Create a new HTML file in the public/ directory
2. Add the page to the vite.config.ts rollupOptions.input
3. Use Tailwind CSS classes for styling

Styling

The project uses Tailwind CSS 4.1 via CDN. You can:

• Use utility classes directly in HTML
• Add custom CSS in <style> tags
• Extend Tailwind configuration in tailwind.config.ts

Deployment

The project can be deployed to any static hosting service:

• Vercel
• Netlify
• GitHub Pages
• Cloudflare Pages
• AWS S3
• Any static file hosting

Example Deployment

# Build for production
bun run build
# Deploy the dist/ folder to your hosting provider

Migration Summary

This project was successfully migrated from:

• React 18 → Pure HTML
• TypeScript → JavaScript
• Complex build system → Simple Vite setup
• Multiple dependencies → Minimal dependencies

Support

For any issues or questions, please open an issue on the GitHub repository.