Setup Svelte

Introduction

Samply is a fully featured premium admin dashboard template in Svelte with Firebase and developer-friendly codes.
Note: You need to fill firebase credentials in src/helpers/firebase.js file.

Firebase

Also fill all the firebase credentials in the src/helpers/firebase.js file.


const firebaseConfig = {
    apiKey: "",
    authDomain: "",
    databaseURL: "",
    projectId: "",
    storageBucket: "",
    messagingSenderId: "",
    appId: "",
    measurementId: "",
};

// Import Firebase Configuration file
import { auth } from "../../../helpers/firebase";
i18n Language translation settings

How to add new language? Let add French language in the existing language.

  1. Create a new file src/lang/fr.json
  2. Now add the new option of French language in the topbar language dropdown menu from /src/common/data/languages.js
  3. You must have to write all text like {$_('message')} to make it working with all languages. Also make sure to add new word 'message' in all other language files src/lang/{language}.json.
  4. If you want to change default language to France? update below code in the src/routes/+layout.svelte file
    
    i18n
    
    import fr from "../lang/fr.json";	
    
    addMessages('fr', fr);
    
    init({
        initialLocale: 'fr',
    });
    
                                                                    
Prerequisites

Please follow below steps to install and setup all prerequisites:

  • Nodejs

    Make sure to have the Node.js installed & running in your computer. If you already have installed Node on your computer, you can skip this step if your existing node version is greater than or equal to 18.18.0.

  • Git

    Make sure to have the Git installed globally & running on your computer. If you already have installed git on your computer, you can skip this step.

Installation

To setup the admin theme, follow below-mentioned steps:

  • Install Prerequisites

    Make sure to have all above prerequisites installed & running on your computer

After you finished with the above steps, you can run the following commands into the terminal / command prompt from the root directory of the project to run the project locally or build for production use:

Command Description
npm install This would install all the required dependencies in the node_modules folder.
npm run dev Runs the project locally, starts the development server and watches for any changes in your code. The development server is accessible at http://localhost:5173/.
npm run build Generates a /build directory with all the production files in the /public directory. You need to host all the public folder files in your server.
Tips

SCSS: We suggest you to do not change any scss files from the /src/assets/scss/custom folders because to get new updates will might be break your SCSS changes if any you have made. We strongly suggest you to use custom.scss file and use that instead of overwrite any theme's custom scss files.