# codeplayground

**Repository Path**: big_screen_code/codeplayground

## Basic Information

- **Project Name**: codeplayground
- **Description**: No description available
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-03-20
- **Last Updated**: 2024-12-02

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Code Playground

I attempt to clone codepen.io using Vue 3 and Monaco editor.

## Installing

1. Install dependencies

   ```bash
   npm install
   ```

2. Fire up the server and watch files

   ```bash
   npm run dev
   ```

## Built with

- [Vue 3](https://v3.vuejs.org/)
- [Vite](https://vitejs.dev/)
- [Monaco Editor](https://github.com/microsoft/monaco-editor)
- [Tailwind CSS](https://tailwindcss.com/)
- [VueUse](https://vueuse.org/)
- [Split.js](https://github.com/nathancahill/split)
- [Skypack for CDN imports](https://www.skypack.dev/)
- [Vercel](https://vercel.com/)

## Recommended IDE Setup

[VSCode](https://code.visualstudio.com/) + [Vetur](https://marketplace.visualstudio.com/items?itemName=octref.vetur). Make sure to enable `vetur.experimental.templateInterpolationService` in settings!

### If Using `<script setup>`

To get proper IDE support for the syntax, use [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar) instead of Vetur (and disable Vetur).

## Inspiration
- https://tailwind-layouts.vercel.app/
- https://play.tailwindcss.com/

## License

Licensed under the [MIT license](https://opensource.org/licenses/MIT).