svelte-firebase

Svelte Firebase

A template to help you start developing SPAs with Svelte and Firebase.

Svelte - Firebase

A free template that you can use to create new applications using Svelte and Firebase.

You can see a live demo here: https://svelte-firebase-template.web.app/

Features

  • Powerfull routing system with nested layouts.
  • Public and Private sections
  • Form validation
  • Preconfigured pages for Home, Login, Signup and more...
  • Secure your database with Firebase rules
  • Fully resposive theme
  • And many more...

Usage

Grab a copy of the template and install the dependencies:

git clone https://github.com/jorgegorka/svelte-firebase my-app-name
cd my-app-name && yarn install

Add your Firebase configuration info to src/config/settings.js

If you don't have a Firebase project you can create one in the Firebase website

Activate cloud firestore, storage and hosting in the Firebase console

const config = {
  apiKey: '',
  authDomain: '',
  databaseURL: '',
  projectId: '',
  storageBucket: '',
  messagingSenderId: ''
}

Update .firebaserc with your project ID

Install all the dependencies required by functions.

cd functions
npm i

Now we want to deploy all the rules, indexes and cloud functions to Firebase.

yarn deploy

This first first deployment will setup Firebase so everything is ready for development.

Development

Launch the development server

yarn dev

Visit http://localhost:5000

To add new pages edit the routes files at src/lib/routes

There are public and protected routes. Protected routes require the visitor to be authenticated before accesing them.

There are two complete CRUD examples: Teams and Employees.

Deployment

Rembember to activate cloud firestore, storage and hosting in the Firebase console before deploying for the first time.

yarn deploy

Enjoy

Contribute

Your comments, suggestions and improvements are very welcome.

Credits

Svelte-Firebase has been created by Jorge Alvarez.

License

Released under MIT license

Top categories

Loading Svelte Themes