MauCoding Web v2.2

Platform belajar coding dan berbagi pengetahuan programming untuk developer Indonesia.

Prerequisites

Before running this project, make sure you have the following installed:

Required Software

• Node.js (v18.0.0 or higher)

  # Check your Node.js version
  node --version
  
  # Install Node.js from https://nodejs.org if not installed

• pnpm (v8.0.0 or higher)

  # Install pnpm globally
  npm install -g pnpm
  
  # Or check if already installed
  pnpm --version

Framework & Technology Stack

This project is built with:

Frontend Framework

• SvelteKit - Full-stack web framework for Svelte
• Svelte 5 - Reactive UI library
• TypeScript - Type-safe JavaScript

Styling & UI

• Tailwind CSS - Utility-first CSS framework
• PostCSS - CSS transformation tool
• Autoprefixer - CSS vendor prefixing

Development Tools

• Vite - Build tool and development server
• ESLint - Code linting and formatting
• Prettier - Code formatting
• Svelte Check - TypeScript and Svelte type checking

Package Manager

• pnpm - Fast, disk space efficient package manager

Getting Started

1. Clone the Repository

git clone https://github.com/yna-studio/maucoding-web-v2.2.git
cd maucoding-web-v2.2

2. Install Dependencies

pnpm install

3. Start Development Server

pnpm dev

# Or open in browser automatically
pnpm dev -- --open

The application will be available at http://localhost:5173

Available Scripts

# Start development server
pnpm dev

# Build for production
pnpm build

# Preview production build
pnpm preview

# Run type checking
pnpm check

# Run type checking in watch mode
pnpm check:watch

# Run linting
pnpm lint

# Format code
pnpm format

# Sync SvelteKit
pnpm prepare

Project Structure

src/
├── lib/
│   ├── components/     # Reusable Svelte components
│   │   ├── Header.svelte
│   │   ├── Footer.svelte
│   │   ├── PostCard.svelte
│   │   └── VideoCard.svelte
│   └── index.ts        # Library entry point
├── routes/
│   ├── +layout.svelte   # Root layout
│   ├── +page.svelte      # Home page
│   └── posts/
│       └── +page.svelte  # Posts listing page
├── app.html             # HTML template
└── app.d.ts           # TypeScript declarations

Building for Production

To create a production version of the app:

pnpm build

This will create a build directory with the optimized application.

Preview Production Build

pnpm preview

Deployment

This project uses @sveltejs/adapter-auto for deployment. The adapter automatically detects the deployment environment and configures the build accordingly.

Supported deployment platforms include:

• Vercel
• Netlify
• Cloudflare Pages
• AWS Amplify
• And more...

Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

License

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