https://github.com/innosan/ml-edu-platform
A web application that uses AI to evaluate essays, providing feedback on grammar, style, coherence, and overall proficiency. This tool is designed to assist students and writers in improving their essay writing skills
https://github.com/innosan/ml-edu-platform
education nuxt web
Last synced: about 1 year ago
JSON representation
A web application that uses AI to evaluate essays, providing feedback on grammar, style, coherence, and overall proficiency. This tool is designed to assist students and writers in improving their essay writing skills
- Host: GitHub
- URL: https://github.com/innosan/ml-edu-platform
- Owner: Innosan
- Created: 2024-10-06T16:18:06.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2024-10-23T18:09:43.000Z (over 1 year ago)
- Last Synced: 2024-10-24T05:32:24.387Z (over 1 year ago)
- Topics: education, nuxt, web
- Language: Vue
- Homepage: https://ml-edu-platform.netlify.app
- Size: 202 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Write Grade
A web application that uses AI to evaluate essays, providing feedback on grammar, style, coherence, and overall proficiency. This tool is designed to assist students and writers in improving their essay writing skills
## Folder Structure
- `assets/`: Contains static assets like stylesheets.
- `styles/`: Main styles directory.
- `css/`: Contains CSS files.
- `scss/`: Contains SCSS files.
- `components/`: Contains Vue components.
- `layout/section/`: Components for layout sections.
- `PageSection.vue`: Component for page sections.
- `SectionTitle.vue`: Component for section titles.
- `navigation/`: Components for navigation.
- `BurgerNavigation.vue`: Component for burger menu navigation.
- `IconedNavigationLink.vue`: Component for navigation links with icons.
- `SidebarNavigation.vue`: Component for sidebar navigation.
- `TopNavigation.vue`: Component for top navigation.
- `theming/`: Components for theming.
- `ColorSwitch.vue`: Component for switching colors.
- `ThemeSwitch.vue`: Component for switching themes.
- `utility/`: Utility components.
- `Header.vue`: Header component.
- `pages/`: Contains page components.
- `about.vue`: About page.
- `help.vue`: Help page.
- `index.vue`: Home page.
- `public/`: Contains public assets.
- `favicon.ico`: Favicon for the application.
- `fonts/`: Contains font files.
- `Manrope-VariableFont_wght.ttf`: Manrope font.
- `images/`: Contains image files.
- `delete.ts`: Example image file.
- `server/`: Contains server-side code.
- `tsconfig.json`: TypeScript configuration for the server.
- `stores/`: Contains Pinia stores.
- `settings.ts`: Store for managing application settings.
- `types/`: Contains TypeScript type definitions.
- `ui/`: UI-related types.
- `SectionSizes.ts`: Type definitions for section sizes.
- `utility/`: Utility types.
- `NavigationLink.ts`: Type definitions for navigation links.
- `utils/`: Contains utility functions.
- `navigation.ts`: Utility functions for navigation.
## Explanation
The project is structured to separate concerns and improve maintainability:
- **Assets**: Static files like stylesheets are organized under `assets` to keep them separate from the application logic.
- **Components**: Vue components are organized by their functionality (layout, navigation, theming, utility) to make it easier to find and manage them.
- **Pages**: Each page of the application has its own file under `pages`, following the Nuxt.js convention.
- **Public**: Public assets like fonts and images are placed under `public` to be served directly.
- **Server**: Server-side code is kept under `server` to separate it from client-side code.
- **Stores**: State management is handled using Pinia stores, which are placed under `stores`.
- **Types**: TypeScript type definitions are organized under `types` to ensure type safety across the application.
- **Utils**: Utility functions are placed under `utils` for reusability and better organization.
## Stores
### `stores/settings.ts`
This file contains the settings store which manages the application's settings, such as the primary color. It uses Pinia for state management.
## Setup
Make sure to install the dependencies:
```bash
# npm
npm install
```
```bash
# pnpm
pnpm install
```
```bash
# yarn
yarn install
```
```bash
# bun
bun install
```
## Deployment
Don't forget to create .env file with the following content:
```dotenv
NUXT_PUBLIC_API_URL=YOUR_API_URL
```
Then run the following command to start the application:
```bash
# bun
bun run dev
```
```bash
# npm
npm run dev
```
```bash
# pnpm
pnpm run dev
```
```bash
# yarn
yarn dev
```
Check out the [Deployment guide](https://nuxt.com/docs/getting-started/deployment) for more information.