Skip to content

Commit f2df46e

Browse files
CoderSerioCoderSerio
committed
docs: update README.md and icons
1 parent 3af1562 commit f2df46e

File tree

3 files changed

+89
-16
lines changed

3 files changed

+89
-16
lines changed

‎README.md‎

Lines changed: 58 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,67 @@
11
<div align="center">
2-
<img width="1200" height="475" alt="GHBanner" src="https://github.com/user-attachments/assets/0aa67016-6eaf-458a-adb2-6e31a0763ed6" />
2+
3+
<img src="public/favicon.svg" width="120" alt="Logo" />
4+
5+
# Source Book: Mini Vue
6+
7+
**An Interactive Journey into Vue.js Internals.**
8+
9+
<p>
10+
<a href="https://coderserio.github.io/vue-source-book/">
11+
<img src="https://img.shields.io/badge/🚀_Start_Learning-Visit_Website-42b883?style=for-the-badge&logo=vue.js&logoColor=white" alt="Website">
12+
</a>
13+
</p>
14+
15+
<p>
16+
<a href="https://github.com/CoderSerio/vue-source-book/blob/main/LICENSE">
17+
<img src="https://img.shields.io/badge/license-MIT-black?style=flat-square" alt="License">
18+
</a>
19+
<a href="https://github.com/CoderSerio/vue-source-book/stargazers">
20+
<img src="https://img.shields.io/github/stars/CoderSerio/vue-source-book?style=flat-square&color=yellow" alt="Stars">
21+
</a>
22+
<a href="https://github.com/CoderSerio/vue-source-book/network/members">
23+
<img src="https://img.shields.io/github/forks/CoderSerio/vue-source-book?style=flat-square&color=orange" alt="Forks">
24+
</a>
25+
</p>
26+
27+
<br>
28+
329
</div>
430

5-
# Run and deploy your AI Studio app
31+
## ✨ Features
32+
33+
- 🎨 **Visual Storytelling** - Complex logic explained through hand-drawn sketches.
34+
- ⚡️ **Interactive Playground** - Write code and see instant feedback in the browser.
35+
- 🧩 **Step-by-Step** - Master Reactivity, VDOM, and Compiler incrementally.
36+
- ⚛️ **Zero Config** - Start learning immediately, no environment setup required.
37+
38+
## 🧠 Core Concepts
39+
40+
| Module | Description | Key Concepts |
41+
| :--- | :--- | :--- |
42+
| **Reactivity** | The heart of Vue's magic | `Proxy`, `Effect`, `Dependency Tracking` |
43+
| **Runtime** | How Vue renders to the DOM | `Virtual DOM`, `Diff Algorithm`, `Patch` |
44+
| **Compiler** | Template transformation | `Parsing`, `AST`, `Code Generation` |
45+
46+
## 💻 Development
47+
48+
Clone and run locally:
649

7-
This contains everything you need to run your app locally.
50+
```bash
51+
git clone https://github.com/CoderSerio/vue-source-book.git
52+
cd vue-source-book
53+
pnpm install
54+
pnpm dev
55+
```
856

9-
View your app in AI Studio: https://ai.studio/apps/drive/1xMx-9w9avmuyYdhEiNELKzFgabfK5LNr
57+
## 💛 Contributors
1058

11-
## Run Locally
59+
Thanks to all the contributors!
1260

13-
**Prerequisites:** Node.js
61+
<a href="https://github.com/CoderSerio/vue-source-book/graphs/contributors">
62+
<img src="https://contrib.rocks/image?repo=CoderSerio/vue-source-book" />
63+
</a>
1464

65+
## 📄 License
1566

16-
1. Install dependencies:
17-
`npm install`
18-
2. Set the `GEMINI_API_KEY` in [.env.local](.env.local) to your Gemini API key
19-
3. Run the app:
20-
`npm run dev`
67+
MIT © [Carbon](https://github.com/CoderSerio)

‎index.html‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
56
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
67
<title>Source Book: Mini Vue - Interactive Source Code Journey</title>
78

@@ -20,24 +21,29 @@
2021
<!-- Open Graph / Facebook -->
2122
<meta property="og:type" content="website" />
2223
<meta property="og:url" content="https://vue-source-book.vercel.app/" />
23-
<meta property="og:title" content="Source Book: Mini Vue" />
24+
<meta
25+
property="og:title"
26+
content="Source Book: Mini Vue - Learn Vue.js Internals Interactively"
27+
/>
2428
<meta
2529
property="og:description"
26-
content="Master Vue.js internals through an interactive, hand-drawn coding adventure."
30+
content="Master Vue.js core concepts (Reactivity, VDOM, Compiler) through a hand-drawn, interactive coding adventure. Built for visual learners."
2731
/>
2832
<meta property="og:image" content="https://vuejs.org/images/logo.png" />
29-
<!-- Placeholder for actual OG image -->
3033

3134
<!-- Twitter -->
3235
<meta property="twitter:card" content="summary_large_image" />
3336
<meta
3437
property="twitter:url"
3538
content="https://vue-source-book.vercel.app/"
3639
/>
37-
<meta property="twitter:title" content="Source Book: Mini Vue" />
40+
<meta
41+
property="twitter:title"
42+
content="Source Book: Mini Vue - Learn Vue.js Internals Interactively"
43+
/>
3844
<meta
3945
property="twitter:description"
40-
content="Master Vue.js internals through an interactive, hand-drawn coding adventure."
46+
content="Master Vue.js core concepts (Reactivity, VDOM, Compiler) through a hand-drawn, interactive coding adventure. Built for visual learners."
4147
/>
4248
<meta
4349
property="twitter:image"

‎public/favicon.svg‎

Lines changed: 20 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)