Vite Electron Builder

screenshot of Vite Electron Builder
react
solid
svelte
vite
vue

Secure boilerplate for Electron app based on Vite. TypeScript + Vue/React/Angular/Svelte/Vanilla

Overview

Stand With UkraineVite Electron Builder Boilerplate is a template for creating secure electron applications. It is designed following the latest safety requirements, recommendations, and best practices. The template uses Vite as a bundler and electron-builder for packaging the application.

Features

  • Electron version: The template uses the latest version of Electron with all the latest security patches. The application architecture is built according to security guides and best practices.
  • Vite version: Vite is used as a bundler for all the source codes. It is known for its extremely fast performance and offers a wide range of amazing features. It supports reading .env files and provides automatic hot-reloads for the Main and Renderer processes. Vite also supports TypeScript, TSX/JSX, CSS/JSON Importing, CSS Modules, Web Assembly, and more.
  • TypeScript version (optional): The template uses the latest version of TypeScript for all the source code. Vite provides built-in support for TypeScript, but it does not support type checking. The code formatting rules follow the latest TypeScript recommendations and best practices.
  • Vue version (optional): By default, the web pages in the template are built using Vue, but it can be easily changed. The code formatting rules follow the latest Vue recommendations and best practices.
  • Continuous Integration: The template includes a configured workflow that checks the types and code style for each push and pull request.
  • Automatic tests: The template includes Vitest, a blazing fast test framework powered by Vite. Unit tests are placed within each package and run separately. End-to-end tests are placed in the root tests directory and use playwright.
  • Publishing: The template includes a release workflow that starts each time changes are pushed to the main branch. It creates a new draft release and replaces artifacts for each commit. This ensures that there is always a draft with the latest artifacts, and the release can be published once it is ready.
  • Code signing: The template supports code signing for added security.

Summary

Stand With UkraineVite Electron Builder Boilerplate is a secure template for creating electron applications. It utilizes Vite as a bundler and offers features such as automatic hot-reloading, TypeScript support, and Vue integration. The template includes continuous integration and automatic testing, making it easy to maintain and deploy applications. With the release workflow and code signing support, it provides a streamlined process for publishing secure applications.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

solid
Solid

SolidJS is a declarative JavaScript library for building user interfaces, offering a reactive programming model for efficient updates. It stands out for its reactivity system that minimizes unnecessary re-renders and its small bundle size, making it a performant choice for developing lightweight and reactive web applications.

svelte
Svelte

Svelte is a modern front-end framework that compiles your code at build time, resulting in smaller and faster applications. It uses a reactive approach to update the DOM, allowing for high performance and a smoother user experience.

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

vue
Vue

Vue.js is a lightweight and flexible JavaScript framework that allows developers to easily build dynamic and reactive user interfaces. Its intuitive syntax, modular architecture, and focus on performance make it a popular choice for modern web development.

template
Templates & Themes

A template or theme refers to a pre-designed layout or structure that provides a basic framework for building a specific type of application or website. It typically includes good design, placeholder content and functional features, allowing developers to customize and fill in the details according to their specific needs.