docs
This commit is contained in:
KUN1007
parent
17d583ca61
commit
7ce1812150
100
README.md
100
README.md
|
|
@ -1,35 +1,38 @@
|
|||
|
||||
|
||||
图片来源为游戏 [Ark Order](https://apps.qoo-app.com/en/app/9593) 中的角色 `鲲`
|
||||
|
||||
# kun-galgame-vue
|
||||
|
||||
.
|
||||
|
||||
|
||||
## 介绍
|
||||
|
||||
|
||||
|
||||
这是 KUNGalgame 论坛的前端，这是第一个版本，我们使用 `vue` 框架编写，之后我们会使用 `svelte` 框架重构
|
||||
这是 KUNGalgame 论坛的前端，这是第一个版本，我们使用 `vue` 框架编写
|
||||
|
||||
|
||||
|
||||
后端项目第一个版本的地址为 [kun-galgame-koa](https://github.com/KUN1007/kun-galgame-koa)
|
||||
KUNGalgame 创建的意义在于：
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## 关于该网站
|
||||
- 大力宣传真正的好游戏，让大家都会用 VNDB 等网站，看到真正的 可视化数据，避免被“大佬”毒害
|
||||
- **远离现代互联网捧一踩一，以批评为美德等等不好的现状**
|
||||
- 让任何人都学习基本的计算机基础，避免“爷新”的出现
|
||||
- 构建一个以用户个人乐趣为主的论坛，抵制鄙视链的产生
|
||||
- 目前的网站大多数套用模板，千篇一律，令人审美疲劳
|
||||
- ......等等。
|
||||
|
||||
|
||||
|
||||
KUNGalgame —— 世界上最萌的 Galgame 论坛！
|
||||
我们认为：“**让你觉得快乐的，让你发自内心笑出来的，才是真正的好游戏！**”
|
||||
|
||||
|
||||
|
||||
为营造最良好的 Galgame 讨论环境为目的进行努力！
|
||||
**后端项目第一个版本的地址为 [kun-galgame-koa](https://github.com/KUN1007/kun-galgame-koa)**
|
||||
|
||||
|
||||
|
||||
Tips: 网站目前正在建设中······
|
||||
|
||||
## 运营理念
|
||||
|
||||
- 世界上最萌的 galgame 论坛
|
||||
|
|
@ -39,6 +42,26 @@ Tips: 网站目前正在建设中······
|
|||
|
||||
|
||||
|
||||
## 技术支持
|
||||
|
||||
* 支持所有手机和电脑端**现代**浏览器
|
||||
* 适配任意大小屏幕
|
||||
* 全部 `Vue3` 组合式 `API`，全部 `Typescript` 支持，编写方式遵从[Vue 官网](vuejs.org)最佳实践
|
||||
|
||||
|
||||
|
||||
## 特性
|
||||
|
||||
### 网站全局设置
|
||||
|
||||
* `I18n` 国际化
|
||||
* 自定义背景图片
|
||||
* 白天 / 黑夜模式
|
||||
* 网站全体字体切换
|
||||
* 网站页面宽度调整
|
||||
|
||||
要查看网站的全部特性情点击这里
|
||||
|
||||
## 项目介绍
|
||||
|
||||
.
|
||||
|
|
@ -47,29 +70,27 @@ Tips: 网站目前正在建设中······
|
|||
|
||||
.
|
||||
|
||||
这是[`KUNGalgame-pure-css`](https://github.com/KUN1007/kungalgame-pure-css) 的**重构版本**，使用 Vite + Vue3 + Vue-router4 + Typescript + SCSS + Pinia 作为前端技术栈，不依赖任何 UI 框架，因为这个项目主打的就是非 UI 框架，世界都一样多没意思呀。由于我的 VScode 自带`ESLint`等必要插件，所以并未在项目中进行集成，预计在项目的第一个版本上线时会集成必要的环境类项目配置。
|
||||
这是[`KUNGalgame-pure-css`](https://github.com/KUN1007/kungalgame-pure-css) 的**重构版本**，使用 Vite + Vue3 + Vue-router4 + Typescript + SCSS + Pinia 作为前端技术栈，不依赖任何 UI 框架，因为这个项目主打的就是非 UI 框架，世界都一样多没意思呀。
|
||||
|
||||
.
|
||||
|
||||
前端项目成型时在项目根目录有一个自带的微型`express`服务器可启动，存放于`server`文件夹，这并不是该项目的后端，只是一个类似于`mockjs`的数据模拟而已，我们的后端计划使用`Rust`编写
|
||||
项目中并未集成 `ESLint`, `Prettier` 等，因为太麻烦了，我爱摸鱼，预计在项目的第一个版本上线时会集成必要的环境类项目配置。
|
||||
|
||||
.
|
||||
|
||||
### 预览
|
||||
|
||||
##### 原项目的地址为：[https://github.com/KUN1007/kungalgame-pure-css](https://github.com/KUN1007/kungalgame-pure-css)
|
||||
##### 纯 HTML + CSS 项目的地址为：[https://github.com/KUN1007/kungalgame-pure-css](https://github.com/KUN1007/kungalgame-pure-css)
|
||||
|
||||
但是我们在重构的时候增加了大量的内容，并且将图标由`fontawesome`改为了`iconify`，所以外观可能会不同，这里仅展示主页预览
|
||||
|
||||
.
|
||||
#### Web 端浏览器
|
||||
|
||||
|
||||
|
||||
|
||||
.
|
||||
|
||||
#### 手机端浏览器
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
### 启动方法
|
||||
|
||||
|
|
@ -77,41 +98,36 @@ Tips: 网站目前正在建设中······
|
|||
|
||||
`cd KUNGalGame-vue`
|
||||
|
||||
#### 服务端
|
||||
|
||||
`cd server `
|
||||
|
||||
`pnpm i`
|
||||
|
||||
`pnpm start`
|
||||
|
||||
#### 前端
|
||||
|
||||
`cd ..`
|
||||
|
||||
`pnpm i`
|
||||
|
||||
`vite dev`
|
||||
|
||||
请注意，请先启动服务端，这样才有模拟的数据
|
||||
|
||||
.
|
||||
|
||||
## 注意事项
|
||||
|
||||
将要发布的只是 V1 版本，我们在设计之初就已经规划好了 V2, V3 版本的内容，包括对 `VNDB` `批评空间` `bangumi` 等网站的数据进行分析，流媒体发布（上传发布视频），APP 版本等等。总之，只要您能想到的，我们都会尽力实现。
|
||||
将要发布的只是 V1 版本，我们在设计之初就已经规划好了 V2, V3 版本的内容，包括
|
||||
|
||||
.
|
||||
* 对 `VNDB` `批评空间` `bangumi` 等网站的数据进行分析
|
||||
* 流媒体发布（上传发布视频）
|
||||
* APP 版本
|
||||
* ......等等
|
||||
|
||||
总之，只要您能想到的，我们都会尽力实现。
|
||||
|
||||
|
||||
|
||||
## Translation
|
||||
|
||||
中文版
|
||||
|
||||
## 联系我们
|
||||
|
||||
如果您想参与我们的开发，可以加入我们的开发群组
|
||||
|
||||
QQ：872839714
|
||||
|
||||
Telegram：https://t.me/KUNForum
|
||||
|
||||
## 开源声明
|
||||
Tencent QQ Group：872839714
|
||||
|
||||
## License
|
||||
|
||||
本项目遵从`GPL`开源协议
|
||||
|
||||
|
|
|
|||
0
docs/README-zh.md
Normal file
0
docs/README-zh.md
Normal file
28
docs/en/README.12062023.md
Normal file
28
docs/en/README.12062023.md
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
# KUNGalgame Forum Vue Frontend Refactor
|
||||
|
||||
The technology stack for this project is: Vite + Vue3 + Ts + Pinia + Scss, and it does not rely on any UI libraries.
|
||||
|
||||
### Pure HTML/CSS version: [kungalgame-pure-css](https://github.com/KUN1007/kungalgame-pure-css)
|
||||
|
||||
PS: This project is currently overwhelming for me. If you have any good ideas, feel free to help out. The project's documentation can be found in ./src/assets/docs.
|
||||
|
||||
The current issues are that there are too many problems to handle, and there is no reasonable starting point. For example:
|
||||
|
||||
* There are no suitable backend data interfaces for me to use. I tried to set up a tiny data interface using Express, but it didn't serve any purpose for me.
|
||||
* I'm unsure how to layout this project. Because the project itself is relatively large, I can't even figure out how to structure it properly. For instance, I'm not sure if I need a ./src/layout.
|
||||
* I'm unsure how to integrate data. For example, I need to define the data for individual topics and users and then call them from anywhere in the project. I think this might be because I haven't learned Pinia well enough?
|
||||
* I'm unsure how to provide reasonable interfaces. I think this may be because my knowledge of Axios is not sufficient.
|
||||
* My components are nested too deeply. For instance, the Home component has 7 layers, which is obviously unreasonable. I need to find a reasonable solution.
|
||||
* I've come to realize that my knowledge of TypeScript/JavaScript is not sufficient (???).
|
||||
|
||||
The biggest problem is that I don't know where to start because I'm not sure where to put basic data, such as in a store, and then how to call it. This is causing significant obstacles to my development because most of my pages require data, and without data flow, nothing is possible.
|
||||
|
||||
---
|
||||
|
||||
06/05/2023
|
||||
Now I understand that my current project falls into the realm of the "big frontend." It involves knowledge of web architecture and requires learning many interactive technologies. I currently lack the knowledge of a "big frontend," so I'm temporarily shelving this project for now and will revisit it later.
|
||||
|
||||
12/06/2023
|
||||
I've encountered another tricky problem, the issue of frontend-backend integration. I find that I can never figure out how to design the API properly. It seems that this indeed requires a good understanding of backend knowledge.
|
||||
|
||||
In summary, the current state of this project is somewhat improved, but it's still a shell. I'll call it an advanced shell (HTML++?). It can only be considered a website once the interface and authentication-related work is completed.
|
||||
72
docs/en/README.18062023.md
Normal file
72
docs/en/README.18062023.md
Normal file
|
|
@ -0,0 +1,72 @@
|
|||
# KUNGalgame Forum Vue Frontend Refactor
|
||||
|
||||
As of June 18, 2023, two months, and over 200 commits, we have almost completed all the static pages. Next, we will be working on the backend of the website.
|
||||
|
||||
## Introduction
|
||||
|
||||
KUNGalgame - The cutest Galgame forum in the world!
|
||||
|
||||
Striving to create the best environment for Galgame discussions!
|
||||
|
||||
Tips: The website is currently under construction...
|
||||
|
||||
## Operating Philosophy
|
||||
|
||||
- The cutest Galgame forum in the world
|
||||
- Based on the idea of creating the best atmosphere
|
||||
- No advertisements, ever
|
||||
- No charges, ever
|
||||
|
||||
## Project Introduction
|
||||
|
||||
### Overview
|
||||
|
||||
This is a **refactored version** of [`KUNGalgame-pure-css`](https://github.com/KUN1007/kungalgame-pure-css), using Vite + Vue3 + Vue-router4 + Typescript + SCSS + Pinia as the frontend tech stack. It doesn't rely on any UI framework, as this project emphasizes a non-UI framework. As my VScode comes with necessary plugins like ESLint, I haven't integrated them into the project. I plan to integrate the required environment and project configurations in the first version of the project.
|
||||
|
||||
When the frontend project is ready, there is a built-in mini `express` server in the project's root directory that can be started, located in the `server` folder. This is not the project's backend; it's just a data mock similar to `mockjs`. Our backend is planned to be written in `Rust`.
|
||||
|
||||
### Preview
|
||||
|
||||
##### The address of the original project is: [https://github.com/KUN1007/kungalgame-pure-css](https://github.com/KUN1007/kungalgame-pure-css)
|
||||
|
||||
However, during the refactoring, we added a lot of content and changed the icons from `fontawesome` to `iconify`, so the appearance may be different. Here, we are only showing a preview of the homepage.
|
||||
|
||||
#### Web Browser
|
||||
|
||||
|
||||
|
||||
#### Mobile Browser
|
||||
|
||||
|
||||
|
||||
### How to Start
|
||||
|
||||
`git clone https://github.com/KUN1007/KUNGalGame-vue`
|
||||
|
||||
`cd KUNGalGame-vue`
|
||||
|
||||
#### Server
|
||||
|
||||
`cd server`
|
||||
|
||||
`pnpm i`
|
||||
|
||||
`pnpm start`
|
||||
|
||||
#### Frontend
|
||||
|
||||
`cd ..`
|
||||
|
||||
`pnpm i`
|
||||
|
||||
`vite dev`
|
||||
|
||||
Please note, start the server first to have simulated data.
|
||||
|
||||
## Important Notes
|
||||
|
||||
Only the V1 version will be released. We have already planned the content for V2 and V3 versions during the initial design, including data analysis of websites such as `VNDB`, `Erogame Space`, `Bangumi`, streaming content uploads, an app version, and more. In summary, we will do our best to implement anything you can think of.
|
||||
|
||||
## Open Source Declaration
|
||||
|
||||
This project follows the `GPL` open-source license.
|
||||
76
docs/en/README.23102023.md
Normal file
76
docs/en/README.23102023.md
Normal file
|
|
@ -0,0 +1,76 @@
|
|||
# kun-galgame-vue
|
||||
|
||||
## Introduction
|
||||
|
||||
This is the frontend of the KUNGalgame forum, and it's the first version. We have built it using the Vue framework, and in the future, we plan to refactor it using the Svelte framework.
|
||||
|
||||
The link to the first version of the backend project is [kun-galgame-koa](https://github.com/KUN1007/kun-galgame-koa).
|
||||
|
||||
## About the Website
|
||||
|
||||
KUNGalgame — The Cutest Galgame Forum in the World!
|
||||
|
||||
We strive to create the best environment for Galgame discussions.
|
||||
|
||||
Tips: The website is currently under construction...
|
||||
|
||||
## Operational Philosophy
|
||||
|
||||
- The cutest galgame forum in the world.
|
||||
- With the aim of creating the best atmosphere.
|
||||
- There will never be any ads.
|
||||
- There will never be any charges.
|
||||
|
||||
## Project Introduction
|
||||
|
||||
### Overview
|
||||
|
||||
This is a **restructured version** of [`KUNGalgame-pure-css`](https://github.com/KUN1007/kungalgame-pure-css). We have used Vite, Vue3, Vue-router4, Typescript, SCSS, and Pinia as the frontend technology stack. We do not depend on any UI framework because this project is focused on a non-UI framework approach. As my VSCode comes with necessary plugins like ESLint, we haven't integrated them into the project. We plan to integrate the required environment and project configurations in the first version to be launched.
|
||||
|
||||
When the frontend project was completed, there was a built-in, lightweight `express` server in the root directory of the project, located in the `server` folder. This server is not the backend for the project; it is merely a data simulation similar to `mockjs`. We plan to write our backend in `Rust`.
|
||||
|
||||
### Preview
|
||||
|
||||
The original project is located at https://github.com/KUN1007/kungalgame-pure-css. However, during the restructuring, we added a lot of content and changed the icons from `fontawesome` to `iconify`. So, the appearance may be different. Here, we provide a preview of the homepage only.
|
||||
|
||||
#### Web Browser
|
||||
|
||||
 
|
||||
|
||||
#### Mobile Browser
|
||||
|
||||
 
|
||||
|
||||
### How to Start
|
||||
|
||||
1. Clone the repository: `git clone https://github.com/KUN1007/KUNGalGame-vue`
|
||||
2. Change the directory: `cd KUNGalGame-vue`
|
||||
|
||||
#### Server
|
||||
|
||||
1. Navigate to the server directory: `cd server`
|
||||
2. Install dependencies: `pnpm i`
|
||||
3. Start the server: `pnpm start`
|
||||
|
||||
#### Frontend
|
||||
|
||||
1. Return to the parent directory: `cd ..`
|
||||
2. Install frontend dependencies: `pnpm i`
|
||||
3. Start the development server: `vite dev`
|
||||
|
||||
Please note that you should start the server first to have simulated data.
|
||||
|
||||
## Notes
|
||||
|
||||
Only version 1 will be released. During the initial design, we have already planned the content for versions 2 and 3, including data analysis for websites like `VNDB`, `批评空间`, `bangumi`, streaming video uploads, and an app version. In short, we will try to implement anything you can think of.
|
||||
|
||||
## Contact Us
|
||||
|
||||
If you wish to participate in our development, you can join our development groups:
|
||||
|
||||
- QQ: 872839714
|
||||
- Telegram: https://t.me/KUNForum
|
||||
|
||||
## Open Source Statement
|
||||
|
||||
This project follows the `GPL` open-source license.
|
||||
28
docs/en/rules.md
Normal file
28
docs/en/rules.md
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
# Code Writing Guidelines
|
||||
|
||||
## Overview
|
||||
|
||||
- Code must follow the `Vue3 composition API + setup + Typescript` approach, following official documentation examples.
|
||||
- Direct DOM operations like `document.getElementById` are not allowed unless absolutely necessary.
|
||||
- Folder names should use `kebab-case`, `.ts` files should use `camelCase`, and `.vue` files should use `PascalCase` for naming.
|
||||
- Packages larger than `500kb` are not allowed to be imported.
|
||||
|
||||
## Vue3
|
||||
|
||||
- Functions like `defineProps` and `defineEmits` must have types declared using TypeScript, in the format `const props = defineProps<{param: type}>()`.
|
||||
- When there are four or more levels of calls, `computed` must be used. Ternary operators must use `computed`.
|
||||
- Component names should be in `PascalCase`, and built-in components must be imported in `PascalCase`, for example, `<RouterLink to="/kun" />`.
|
||||
- When passing props from a parent component to a child component, use `kebab-case` naming. Use `camelCase` for `v-on` events.
|
||||
|
||||
## TypeScript
|
||||
|
||||
- The use of `any` is not allowed.
|
||||
- Interfaces should be named in `PascalCase`.
|
||||
- Declaration files with a `.d.ts` extension should be named using `kebab-case`.
|
||||
|
||||
## Variables and Functions
|
||||
|
||||
- Variables should preferably be declared using `const`, and functions should preferably be declared using arrow function syntax like `const kun = () => {}`.
|
||||
- Boolean values should always start with `is`, for example, `isShowToolbar`.
|
||||
- Functions in the `store` should be named using the `use...store` convention, for example, `useKUNGalgameEditStore`.
|
||||
- For complex functions, use the `@param {type} paramName` format for writing comments.
|
||||
117
docs/zh/README.23102023.md
Normal file
117
docs/zh/README.23102023.md
Normal file
|
|
@ -0,0 +1,117 @@
|
|||
# kun-galgame-vue
|
||||
|
||||
.
|
||||
|
||||
## 介绍
|
||||
|
||||
|
||||
|
||||
这是 KUNGalgame 论坛的前端，这是第一个版本，我们使用 `vue` 框架编写，之后我们会使用 `svelte` 框架重构
|
||||
|
||||
|
||||
|
||||
后端项目第一个版本的地址为 [kun-galgame-koa](https://github.com/KUN1007/kun-galgame-koa)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## 关于该网站
|
||||
|
||||
|
||||
|
||||
KUNGalgame —— 世界上最萌的 Galgame 论坛！
|
||||
|
||||
|
||||
|
||||
为营造最良好的 Galgame 讨论环境为目的进行努力！
|
||||
|
||||
|
||||
|
||||
Tips: 网站目前正在建设中······
|
||||
|
||||
## 运营理念
|
||||
|
||||
- 世界上最萌的 galgame 论坛
|
||||
- 以营造最良好的氛围为理念
|
||||
- 永远不会有广告
|
||||
- 永远不会收费
|
||||
|
||||
|
||||
|
||||
## 项目介绍
|
||||
|
||||
.
|
||||
|
||||
### 简介
|
||||
|
||||
.
|
||||
|
||||
这是[`KUNGalgame-pure-css`](https://github.com/KUN1007/kungalgame-pure-css) 的**重构版本**，使用 Vite + Vue3 + Vue-router4 + Typescript + SCSS + Pinia 作为前端技术栈，不依赖任何 UI 框架，因为这个项目主打的就是非 UI 框架，世界都一样多没意思呀。由于我的 VScode 自带`ESLint`等必要插件，所以并未在项目中进行集成，预计在项目的第一个版本上线时会集成必要的环境类项目配置。
|
||||
|
||||
.
|
||||
|
||||
前端项目成型时在项目根目录有一个自带的微型`express`服务器可启动，存放于`server`文件夹，这并不是该项目的后端，只是一个类似于`mockjs`的数据模拟而已，我们的后端计划使用`Rust`编写
|
||||
|
||||
.
|
||||
|
||||
### 预览
|
||||
|
||||
##### 原项目的地址为：[https://github.com/KUN1007/kungalgame-pure-css](https://github.com/KUN1007/kungalgame-pure-css)
|
||||
|
||||
但是我们在重构的时候增加了大量的内容，并且将图标由`fontawesome`改为了`iconify`，所以外观可能会不同，这里仅展示主页预览
|
||||
|
||||
.
|
||||
#### Web 端浏览器
|
||||
|
||||
|
||||
.
|
||||
|
||||
#### 手机端浏览器
|
||||
|
||||
|
||||
|
||||
### 启动方法
|
||||
|
||||
`git clone https://github.com/KUN1007/KUNGalGame-vue`
|
||||
|
||||
`cd KUNGalGame-vue`
|
||||
|
||||
#### 服务端
|
||||
|
||||
`cd server `
|
||||
|
||||
`pnpm i`
|
||||
|
||||
`pnpm start`
|
||||
|
||||
#### 前端
|
||||
|
||||
`cd ..`
|
||||
|
||||
`pnpm i`
|
||||
|
||||
`vite dev`
|
||||
|
||||
请注意，请先启动服务端，这样才有模拟的数据
|
||||
|
||||
.
|
||||
|
||||
## 注意事项
|
||||
|
||||
将要发布的只是 V1 版本，我们在设计之初就已经规划好了 V2, V3 版本的内容，包括对 `VNDB` `批评空间` `bangumi` 等网站的数据进行分析，流媒体发布（上传发布视频），APP 版本等等。总之，只要您能想到的，我们都会尽力实现。
|
||||
|
||||
.
|
||||
|
||||
## 联系我们
|
||||
|
||||
如果您想参与我们的开发，可以加入我们的开发群组
|
||||
|
||||
QQ：872839714
|
||||
|
||||
Telegram：https://t.me/KUNForum
|
||||
|
||||
## 开源声明
|
||||
|
||||
本项目遵从`GPL`开源协议
|
||||
|
||||
Binary file not shown.
Loading…
Reference in a new issue