Skip to content

npashayev/code-universe

Repository files navigation

Code Universe

Welcome to Code Universe, an interactive, space-themed educational platform designed to make learning programming languages engaging and immersive. By exploring different "Planets" (such as HTML, CSS, JavaScript, etc.), users can traverse through a structured curriculum, complete interactive coding challenges, and level up their skills.

🌐 Live Demo: code-universe-nu.vercel.app


Key Features

  • Interactive "Planet" Curriculum: Step-by-step learning paths represented as explorable planets, each focusing on specific concepts and coding challenges.
  • Integrated Code Editor: Write and test code directly in the browser with our built-in Monaco Editor integration, providing a VS Code-like experience.
  • Drag-and-Drop Activities: Engaging UI interactions powered by @dnd-kit for interactive exercises.
  • Internationalization (i18n): Multi-language support (English, Azerbaijani, and more) to make learning accessible globally.
  • Stunning Animations: Smooth transitions and micro-interactions powered by Framer Motion and GSAP for a truly premium feel.
  • Secure Authentication: Seamless user login and role management handled by NextAuth.js.

Tech Stack

Code Universe is built using modern, highly scalable web technologies:

Frontend

  • Framework: Next.js (App Router, React 19)
  • Styling: Tailwind CSS v4
  • Animations: Framer Motion & GSAP
  • Code Editor: Monaco Editor
  • State Management & Data Fetching: TanStack React Query & Immer
  • Drag & Drop: @dnd-kit
  • Icons: FontAwesome & Lucide React

Backend & Database

  • API: Next.js Server Actions & Route Handlers
  • Database ORM: Prisma
  • Database: MongoDB
  • Authentication: NextAuth.js (Prisma Adapter)
  • Cloud Storage: AWS S3 (via @aws-sdk/client-s3)

Tooling & Code Quality

  • Language: TypeScript
  • Linting & Formatting: ESLint & Prettier
  • Analytics: Vercel Analytics & Speed Insights

Getting Started

Prerequisites

  • Node.js 18+
  • MongoDB instance (local or Atlas)
  • Cloudflare R2 or AWS S3 bucket (for cloud storage)

Installation

  1. Clone the repository

    git clone https://github.com/npashayev/code-universe.git
    cd code-universe
  2. Install dependencies

    npm install
  3. Set up environment variables

    cp .env.example .env.local

    Open .env.local and fill in your details.

  4. Initialize the database

    npx prisma generate
    npx prisma db push
  5. Run the development server

    npm run dev

Open http://localhost:3000 to see the app.


Contributing

Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

License

This project is licensed under the PolyForm Noncommercial License 1.0.

You are free to:

  • Use this repository as a reference for educational purposes.
  • Learn from the structure, architecture, and code.
  • Contribute to the project via Pull Requests.

You are NOT permitted to:

  • Use the code, design, or assets for any commercial purposes.
  • Sell, distribute, or monetize this software in any way.

See the LICENSE file for full legal terms.

About

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages