Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Upgrade to nuxt 3 stable, remove histoire #75

Merged
merged 13 commits into from
Nov 20, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
1 change: 0 additions & 1 deletion .dockerignore
Original file line number Diff line number Diff line change
Expand Up @@ -3,5 +3,4 @@ npm-debug*
.nuxt
dist
tests
.histoire
.output
3 changes: 0 additions & 3 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -59,9 +59,6 @@ jspm_packages/
# Nuxt generate
dist

# Histoire output
.histoire

# vuepress build output
.vuepress/dist

Expand Down
21 changes: 15 additions & 6 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@

sidebase is a modern, best-practice, batteries-included fullstack-app starter based on Nuxt 3 and TypeScript.

With this nuxt 3 starter you get production-ready frontend + backend projects while still having fun! [Atinux, CEO of Nuxt](https://github.com/Atinux) said to sidebase on Twitter:
With this Nuxt 3 starter you get production-ready frontend + backend projects while still having fun! [Atinux, CEO of Nuxt](https://github.com/Atinux) said to sidebase on Twitter:
> Beautiful work on sidebase!

## Quick start
Expand Down Expand Up @@ -41,16 +41,15 @@ With this nuxt 3 starter you get production-ready frontend + backend projects wh

The key features are:
- 🎒 **Fullstack**: Develop frontend and backend in a single TypeScript code base
- Fullstack [`Vue 3`](https://vuejs.org/) + [`Nuxt 3 RC.10`](https://v3.nuxtjs.org/),
- Data base models, migrations, queries and easy DB-switching via [`TypeORM`](https://typeorm.io/),
- Fullstack [`Vue 3`](https://vuejs.org/) + [`Nuxt 3 (stable)`](https://v3.nuxtjs.org/),
- Database models, migrations, queries and easy DB-switching via [`TypeORM`](https://typeorm.io/),
- Frontend- and Backend data-transformation via [`nuxt-parse`](https://www.npmjs.com/package/@sidebase/nuxt-parse) and [`zod`](https://github.com/colinhacks/zod),
- In-memory development SQL-database via [`sqlite3`](https://www.sqlite.org/index.html),
- Linting via [`eslint`](https://eslint.org/),
- Test management, Test UI, component snapshotting via [`vitest`](https://vitest.dev/),
- Component tests via [`test-library/vue`](https://testing-library.com/),
- API tests via [`supertest`](https://github.com/visionmedia/supertest),
- Code coverage via [`c8`](https://github.com/bcoe/c8),
- Component stories via [`histoire`](https://histoire.dev/),
- CSS utiltities via [`TailwindCSS`](https://tailwindcss.com/),
- CSS components via [`Ant Design Vue`](https://antdv.com/components/overview),
- Type checking in script and template via [`Volar / vue-tsc`](https://github.com/johnsoncodehk/volar)
Expand All @@ -73,7 +72,6 @@ Useful Commands for development, testing and deployment:
- Develop & Debug the app:
- `npm i`: Install required dependencies
- `npm run dev`: Start the fullstack app, including database
- `npm run story`: Start `histoire` for component story based development of UI
- Linting & Formatting (`npm run lint`)
- `npm run lint:style`: eslint for formatting & linting
- `npm run lint:style -- --fix`: Autofix styles and lints where possible
Expand Down Expand Up @@ -108,7 +106,7 @@ Useful Commands for development, testing and deployment:
- `nvm use`: If you use `nvm`, use this command to make sure that your local environment uses the correct, required node version
- Pre-commit checking (husky) & fixing (lint-staged)
- github CI pipeline to linting, testing, typing checks
- nuxt-component support in tests and histoire
- nuxt-component support in tests
- debug sql database queries by setting `logging: true` in the `database/index.ts`: This will show you a live log of all ongoing database queries which is super helpful to debug database problems

### Guides
Expand Down Expand Up @@ -160,6 +158,17 @@ If you have type-problems after running `npm i` for the first time:

If none of this works, file an issue (preferrably with a reproduction) [here](https://github.com/sidebase/sidebase/issues/new/choose).

#### `yarn`

We use the `overrides` key in the `package.json`. `yarn` does not support this, you will have to replace it with:
```
"resolutions": {
"typeorm/**/parse5": "6.0.1"
}
```

for it to work with yarn.

#### `nuxt-parse`

1. [`nuxt-parse`](https://www.npmjs.com/package/@sidebase/nuxt-parse) to validate and deserialize data from the `server` in the `frontend`:
Expand Down
38 changes: 0 additions & 38 deletions components/example/ShowCase.story.vue

This file was deleted.

23 changes: 0 additions & 23 deletions components/example/Status.story.vue

This file was deleted.

2 changes: 1 addition & 1 deletion components/example/__snapshots__/ShowCase.test.ts.snap
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ exports[`ShowCase > mounts and is still the same 1`] = `
<form>
<div class=\\"flex\\"><span class=\\"ant-input-group-wrapper\\"><span class=\\"ant-input-wrapper ant-input-group\\"><span class=\\"ant-input-group-addon\\">Please enter your name:</span><input placeholder=\\"Your name...\\" type=\\"text\\" class=\\"ant-input\\">
<!----></span></span><button class=\\"ant-btn ant-btn-primary\\" type=\\"submit\\">
<transition-stub>
<transition-stub name=\\"ant-btn-loading-icon-motion\\" appear=\\"false\\" persisted=\\"false\\" css=\\"true\\">
<!---->
</transition-stub><span>Submit</span>
</button>
Expand Down
2 changes: 0 additions & 2 deletions env.d.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
// Types for histoire
/// <reference types="@histoire/plugin-vue/components" />
// Types for nuxt, to avoid volar-reload after `nuxi prepare`, see https://github.com/nuxt/framework/issues/7544#issuecomment-1247920103
/// <reference types="nuxt" />
// To get correct types for `svg`s
Expand Down
13 changes: 0 additions & 13 deletions histoire.config.ts

This file was deleted.