An open API service indexing awesome lists of open source software.

https://github.com/tinspham209/codepen-clone

CodePen Clone with React
https://github.com/tinspham209/codepen-clone

codemirror codepen react react-codemirror2

Last synced: 6 months ago
JSON representation

CodePen Clone with React

Awesome Lists containing this project

README

          

# Mini Project: CodePen Clone

## Date: 30 - Sep - 2020

### Screenshot

- codepen-clone

### Tech-Stack

- React
- codemirror
- react-codemirror2
- react-icons

### Deploy

- http://codepen.tinspham.info/

### Plan Of Action

- Initial Project
- Install dependencies
- HTML Setup
- Editor Setup
- CSS
- CodePen Functionality
- Open Close Button
- Local Storage Hook
- Deploy to surge.sh
- Add custom domain
- Write README

### Directory Structure

```
.
├── .gitignore
├── package.json
├── README.md
├── public
└── src
├── components
├── App.js
└── Editor.js
├── hooks
└── useLocalStorage.js
├── App.js
├── index.css
└── index.js
```

### Set up

Use the cmd line to clone repo to your computer

```
git clone [github_repo_url]
```

Use the cmd line to install dependencies.

```
npm install
```

Run in cmd for start the dependencies server

```
npm start
```