streaper2/maaw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rebrand

Browse Source
This commit is contained in:
Michael Dausmann
2023-09-03 12:28:01 +10:00
parent 84543aad1b
commit 30ddde0046
12 changed files with 28 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
CHANGELOG.md
View File

@@ -20,7 +20,7 @@ First Release version. If your package.json does not have a version attribute,
This is what I did to create the project including all the extra fiddly stuff. Putting this here so I don't forget.
### Setup Nuxt
Follow instructions from here https://nuxt.com/docs/getting-started/installation
I Followed instructions from here https://nuxt.com/docs/getting-started/installation
```bash
# install node

22
README.md
View File

@@ -1,19 +1,21 @@
# Nuxt 3 (SAAS) Boilerplate
![SupaNuxt SaaS](assets/images/supanuxt_logo_200.png)
# SupaNuxt SaaS
[![Netlify Status](https://api.netlify.com/api/v1/badges/19d67f94-afdc-4b79-8490-600be26e85de/deploy-status)](https://app.netlify.com/sites/nuxt3-saas-boilerplate/deploys)
## Demo Sites
Boilerplate Demo site [here](https://nuxt3-saas-boilerplate.netlify.app/)
Demo site [here](https://nuxt3-saas-boilerplate.netlify.app/)
Pottery Helper [here](https://potteryhelper.com/)
## Tech Stack
- Nuxt 3 (I like it, shut up)
- Supabase (Auth including OAuth + Postgresql instance)
- Prisma (Schema management + Strongly typed client)
- TRPC (Server/Client communication with Strong types, SSR compatible)
- Pinia (State Store. I liked vuex a lot, in particular explicit mutations but gotta go with the cool crowd)
- Stripe (Payments including Webhook integration)
- Tailwind + daisyUI (Tailwind because everybody is using it, daisyUI because I suck at tailwind)
- Nuxt 3
- Supabase (auth including OAuth + Postgresql instance)
- Prisma (schema management + Strongly typed client)
- TRPC (server/client communication with Strong types, SSR compatible)
- Pinia (state Store)
- Stripe (payments including webhook integration)
- Tailwind + daisyUI (styling and components)
- OpenAI (text completions with AI)
## Features
@@ -102,7 +104,7 @@ This solution uses Supabase for Auth and to provide a DB. In addition to Magic
1) Go to [Supabase](https://supabase.com/) and 'Start your Project'
2) Setup your org and project (Free tier is fine to start)
3) Update the project's email template (Supabase -> Authentication -> Email Templates)
Note that the default Supabase email templates are very generic and for some reason this can lead to your emails being sent to spam folders. e.g. I to get my password reset emails to go to inbox, I needed to change the subject to "Password Reset for Nuxt 3 SAAS Boilerplate" and also the email body text.
Note that the default Supabase email templates are very generic and for some reason this can lead to your emails being sent to spam folders. e.g. I to get my password reset emails to go to inbox, I needed to change the subject to "Password Reset for ..." and also the email body text.
4) Choose an OAuth provider. I have chosen Google using these [Instructions](https://supabase.com/docs/guides/auth/social-login/auth-google) for the purposes of demonstration but they all should work.
5) Go to Project Settings -> API and copy Project URL and Project API Key to SUPABASE_URL and SUPABASE_KEY settings respectively in your [.env](/.env) file
6) Go to Project Settings -> Database -> Connection String -> URI and copy the uri value into the DATABASE_URL setting in your [.env](/.env) file, remembering to replace ```[YOUR-PASSWORD]``` with the password you provided when you setup the project.

BIN
assets/images/supanuxt_logo_100.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
assets/images/supanuxt_logo_200.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
assets/images/supanuxt_logo_400.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 69 KiB

BIN
assets/images/supanuxt_logo_800.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 139 KiB

4
components/AppHeader.vue
View File

@@ -49,7 +49,7 @@
<li v-if="!user"><NuxtLink to="/signin">Sign In</NuxtLink></li>
</ul>
</div>
<NuxtLink to="/" class="btn btn-ghost normal-case text-xl">Nuxt3 SAAS Boilerplate</NuxtLink>
<NuxtLink to="/" class="btn btn-ghost normal-case text-xl">SupaNuxt SAAS</NuxtLink>
</div>
<div class="navbar-center hidden lg:flex">
<ul class="menu menu-horizontal px-1">
@@ -57,7 +57,7 @@
<li><NuxtLink to="/pricing">Pricing</NuxtLink></li>
<li v-if="!user"><NuxtLink to="/signin">Sign In</NuxtLink></li>
<li v-if="!user"><NuxtLink to="/signup">Start for free</NuxtLink></li>
<li v-if="!user"><a title="github" href="https://github.com/JavascriptMick/nuxt3-boilerplate"><Icon name="mdi:github"/></a></li>
<li v-if="!user"><a title="github" href="https://github.com/JavascriptMick/supanuxt-saas"><Icon name="mdi:github"/></a></li>
</ul>
</div>
<div class="navbar-end" v-if="user">

2
nuxt.config.ts
View File

@@ -16,7 +16,7 @@ export default defineNuxtConfig({
htmlAttrs: {
lang: 'en',
},
title: 'Nuxt 3 SAAS Boilerplate',
title: 'SupaNuxt SaaS',
},
},
runtimeConfig:{

4
package-lock.json generated
View File

@@ -1,11 +1,11 @@
{
"name": "nuxt3-boilerplate",
"name": "supanuxt-saas",
"version": "1.1.0",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "nuxt3-boilerplate",
"name": "supanuxt-saas",
"version": "1.1.0",
"hasInstallScript": true,
"license": "MIT",

2
package.json
View File

@@ -1,5 +1,5 @@
{
"name": "nuxt3-boilerplate",
"name": "supanuxt-saas",
"version": "1.1.0",
"author": {
"name": "Michael Dausmann",

17
pages/index.vue
View File

@@ -14,10 +14,10 @@ const user = useSupabaseUser()
<div class="grid grid-cols-1 md:grid-cols-2 gap-16">
<div class="m-5">
<h1 class="text-5xl font-bold mb-4">
Build Your Next SAAS Faster
Build Your Next SaaS Faster
</h1>
<p class="text-gray-700 text-lg mb-8">
With Nuxt 3 SAAS Boilerplate, you can easily get started building your
With SupaNuxt SaaS, you can easily get started building your
next web application. Our pre-configured tech stack and
industry leading features make it easy to get up and running in no time. Look! this guy is working so fast,
his hands are just a blur.. you could be this fast.
@@ -25,8 +25,7 @@ const user = useSupabaseUser()
<NuxtLink to="/signup" class="inline-block py-3 px-6 bg-blue-600 text-white rounded-lg hover:bg-blue-700">Get Started</NuxtLink>
</div>
<div>
<img src="~/assets/images/saas_landing_main.jpeg"
alt="Hero Image" />
<img src="~/assets/images/supanuxt_logo_200.png" alt="SupaNuxt SaaS Logo"/>
</div>
</div>
</div>
@@ -105,7 +104,7 @@ const user = useSupabaseUser()
</div>
<div class="md:w-1/2">
<h3 class="text-xl font-bold mb-4">User Management</h3>
<p class="mb-4">Our Nuxt 3 SAAS Boilerplate project includes robust user management features, including
<p class="mb-4">SupaNuxt SaaS includes robust user management features, including
authentication with social login (oauth) or email/password, management of user roles and permissions, and
multi-user/team accounts that permit multiple users to share plan features including a team administration
facility and user roles within team. This is a great feature for businesses or community groups who want to
@@ -134,7 +133,7 @@ const user = useSupabaseUser()
</div>
<div class="md:w-1/2">
<h3 class="text-xl font-bold mb-4">Config and Environment</h3>
<p class="mb-4">Nuxt 3 SAAS Boilerplate includes an approach to config and environment
<p class="mb-4">SupaNuxt SaaS includes an approach to config and environment
management that enables customisation and management of api keys.</p>
</div>
</div>
@@ -146,7 +145,7 @@ const user = useSupabaseUser()
</div>
<div class="md:w-1/2">
<h3 class="text-xl font-bold mb-4">State Management</h3>
<p class="mb-4">Nuxt 3 SAAS Boilerplate includes multi modal state management that supports both Single Page Application (SPA)
<p class="mb-4">SupaNuxt SaaS includes multi modal state management that supports both Single Page Application (SPA)
pages such as dashboards and Server Side Rendered (SSR) style pages for public content that are crawlable by Search
engines like google and facilitate excellent Search Engine Optimisation (SEO).</p>
</div>
@@ -159,7 +158,7 @@ const user = useSupabaseUser()
</div>
<div class="md:w-1/2">
<h3 class="text-xl font-bold mb-4">Stripe Integration</h3>
<p class="mb-4">Nuxt 3 SAAS Boilerplate includes Stripe integration for subscription payments including
<p class="mb-4">SupaNuxt SaaS includes Stripe integration for subscription payments including
Subscription based support for multi pricing and multiple plans.</p>
</div>
</div>
@@ -171,7 +170,7 @@ const user = useSupabaseUser()
</div>
<div class="md:w-1/2">
<h3 class="text-xl font-bold mb-4">Style System</h3>
<p class="mb-4">Nuxt 3 SAAS Boilerplate includes Tailwind integration for site styling including a themable UI components with daisyUI</p>
<p class="mb-4">SupaNuxt SaaS includes Tailwind integration for site styling including a themable UI components with daisyUI</p>
</div>
</div>
</div>

2
pages/pricing.vue
View File

@@ -13,7 +13,7 @@
<div class="flex flex-col items-center max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:py-16 lg:px-8">
<div class="text-center mb-12">
<h2 class="text-4xl font-extrabold tracking-tight text-gray-900 sm:text-5xl md:text-6xl mb-4">Flexible Pricing</h2>
<p class="text-xl text-gray-500">Get started with the best boiler for your SAAS plate</p>
<p class="text-xl text-gray-500">SupaNuxt SaaS is completely free and open source but you can price your own SaaS like this</p>
</div>
<div class="flex flex-col md:flex-row justify-center items-center">