{"id":18284448,"url":"https://github.com/soulsam480/elec-sqlite-vue","last_synced_at":"2025-04-05T07:31:42.155Z","repository":{"id":51392144,"uuid":"297244999","full_name":"soulsam480/elec-sqlite-vue","owner":"soulsam480","description":"Testing integration of vue3 + Electron 7.0.0 + SQlite + Sequelize","archived":true,"fork":false,"pushed_at":"2021-05-12T09:18:14.000Z","size":258,"stargazers_count":30,"open_issues_count":1,"forks_count":11,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-02T21:53:18.051Z","etag":null,"topics":["electron","sequelize","sequelize-models","sqlite-sequelize","vue"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/soulsam480.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"COPYING.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-09-21T06:11:14.000Z","updated_at":"2025-01-17T14:06:57.000Z","dependencies_parsed_at":"2022-09-11T04:31:03.398Z","dependency_job_id":null,"html_url":"https://github.com/soulsam480/elec-sqlite-vue","commit_stats":null,"previous_names":[],"tags_count":1,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/soulsam480%2Felec-sqlite-vue","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/soulsam480%2Felec-sqlite-vue/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/soulsam480%2Felec-sqlite-vue/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/soulsam480%2Felec-sqlite-vue/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/soulsam480","download_url":"https://codeload.github.com/soulsam480/elec-sqlite-vue/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247305871,"owners_count":20917197,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["electron","sequelize","sequelize-models","sqlite-sequelize","vue"],"created_at":"2024-11-05T13:13:37.786Z","updated_at":"2025-04-05T07:31:37.147Z","avatar_url":"https://github.com/soulsam480.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## Vue 3 + Electron + Sqlite + Sequelize\n\nPOC for Electron app with Vue 3 frontend and persisted database with SQlite.\n\n#### Setup\n\nInside project root folder\n\nnote: I prefer using yarn as npm is highly unstable with electron and vue integration\n\n```bash\nyarn \n\nyarn electron:serve\n```\nTo Build App for OS executables\n\n```bash\nyarn electron:build\n```\n### File Structure\n\n- The project is a normal Vue CLI project. So the file structure is pretty familiar.\n- The electron builder plugin adds a new file `src/background.ts` , this serves as the entry point of the electron app.\n- `src/data.db` In project SQlite 3 database for testing.\n- `getdb.ts` Initiates the Sequelize instance for using the database. \n- `main.ts` entry of vue app. It creates the vue instance and mounts the app.\n\n#### Where to code ?\n\n- For adding pages/views for electron app go to \u003e `src/views`. \n- For adding components to be used i Vue pages/views go to \u003e `src/components` \n- To create new app window / or any electron stuff go to \u003e `src/background.ts`\n- For working with database i.e. creating models for sequelize go to \u003e `src/getdb.ts`\n\n#### Config Files\n- `tsconfig.json` for configuring typescript.\n- `vue.config.js` Vue config. Not recommended to change anything in this file.\n\n\n#### A brief note on Sequelize\n\n- Sequelize is a promise based ORM. So using it is pretty easy.\n- Whe using sequelize we don't have to create tables as it creates and syncs tables according to the defined models.\n- Sequelize models are a abstaction of the data schema or the table schema of a db. So instead of using SQL queries for creating tables we can make sequelize to do that by using models.\n- A sample model `User` is defined in `src/getdb.ts`. Learn more about sequelize [Models](https://sequelize.org/master/manual/model-basics.html)\n```javascript\n// a sample model USer\nconst User = sequelize.define('User', {\n    firstName: {\n        type: DataTypes.STRING,\n        allowNull: false\n    },\n    lastName: {\n        type: DataTypes.STRING\n    },\n\n}, {\n});\n```\n- SQL queries are replaced by sequelize model queries .\n```javascript\n// sample query for model User\n// inside an async function\n\nUser.findAll().then((res)=\u003e{\n\tconsole.log(res)\n}).catch(err=\u003e console.log(err))\n\n```\nLean more about model Queries [here](https://sequelize.org/master/manual/model-querying-basics.html)\n\n- More about Sequelize can be found in their [Docs](https://sequelize.org/master/). Not that good but functional.\n\n### Notes\n\n- Usage with Vuex is not recommended as it causes the db process to stop on reload.\n  \n### Known Bugs\n\n- There are no known bugs as the build was successful with no errors.\n- To report a bug create an issue.\n\n### Errors\nFor errors try googling or contact me!\n\n### References\n\n- [Vue CLI Plugin Electron Builder Docs](https://nklayman.github.io/vue-cli-plugin-electron-builder/)\n- [Sequelize Docs](https://sequelize.org/master/)\n- [Electron Docs](https://www.electronjs.org/)\n- [Vue 3 Docs](https://v3.vuejs.org)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsoulsam480%2Felec-sqlite-vue","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsoulsam480%2Felec-sqlite-vue","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsoulsam480%2Felec-sqlite-vue/lists"}