|
1 | | -\# CodePlay – Live Code Editor 🚀 |
2 | | - |
3 | | - |
4 | | - |
5 | | -\## Web Engineering Final Project |
6 | | - |
| 1 | +# CodePlay – Live Code Editor 🚀 |
7 | 2 |
|
| 3 | +## Web Engineering Final Project |
8 | 4 |
|
9 | 5 | CodePlay is a web-based Live Code Editor that allows users to write and preview HTML, CSS, and JavaScript code in real time. |
10 | | - |
11 | 6 | This project is developed as part of the Web Engineering (Semester V) Final Project. |
12 | 7 |
|
13 | | - |
14 | | - |
15 | 8 | --- |
16 | 9 |
|
17 | | - |
18 | | - |
19 | | -\## Project Overview |
20 | | - |
21 | | - |
| 10 | +## Project Overview |
22 | 11 |
|
23 | 12 | CodePlay provides an interactive coding environment where users can: |
24 | | - |
25 | | -\- Write HTML, CSS, and JavaScript code |
26 | | - |
27 | | -\- Instantly see the output |
28 | | - |
29 | | -\- Experiment with front-end development concepts easily |
30 | | - |
31 | | - |
| 13 | +- Write HTML, CSS, and JavaScript code |
| 14 | +- Instantly see the output |
| 15 | +- Experiment with front-end development concepts easily |
32 | 16 |
|
33 | 17 | --- |
34 | 18 |
|
35 | | - |
36 | | - |
37 | | -\## Technologies Used |
38 | | - |
39 | | -\- HTML5 |
40 | | - |
41 | | -\- CSS3 |
42 | | - |
43 | | -\- JavaScript |
44 | | - |
45 | | - |
| 19 | +## Technologies Used |
| 20 | +- HTML5 |
| 21 | +- CSS3 |
| 22 | +- JavaScript |
46 | 23 |
|
47 | 24 | --- |
48 | 25 |
|
49 | | - |
50 | | - |
51 | | -\## Features |
52 | | - |
53 | | -\- Separate editors for HTML, CSS, and JavaScript |
54 | | - |
55 | | -\- Real-time live preview |
56 | | - |
57 | | -\- Dark theme interface |
58 | | - |
59 | | -\- Run Code button |
60 | | - |
61 | | -\- Save and Reset options |
62 | | - |
63 | | -\- Console output panel |
64 | | - |
65 | | -\- Responsive design |
66 | | - |
67 | | - |
| 26 | +## Features |
| 27 | +- Separate editors for HTML, CSS, and JavaScript |
| 28 | +- Real-time live preview |
| 29 | +- Dark theme interface |
| 30 | +- Run Code button |
| 31 | +- Save and Reset options |
| 32 | +- Console output panel |
| 33 | +- Responsive design |
68 | 34 |
|
69 | 35 | --- |
70 | 36 |
|
| 37 | +## Output / Screenshot |
71 | 38 |
|
72 | | - |
73 | | -\## Output / Screenshot |
74 | | - |
75 | | - |
76 | | - |
77 | | -!\[Live Code Editor](screenshots/home.png) |
78 | | - |
79 | | - |
| 39 | + |
| 40 | + |
80 | 41 |
|
81 | 42 | --- |
82 | 43 |
|
| 44 | +## How to Run the Project |
83 | 45 |
|
84 | | - |
85 | | -\## How to Run the Project |
86 | | - |
87 | | - |
88 | | - |
89 | | -1\. Clone the repository: |
90 | | - |
| 46 | +1. Clone the repository: |
91 | 47 | ```bash |
92 | | - |
93 | 48 | git clone https://github.com/mrmushtaq/Web-Engineering-Project-Live-Code-Editor-of-HTML-CSS-JS.git |
94 | | - |
95 | | - |
96 | | - |
0 commit comments