Code Monkey home page Code Monkey logo

zonayedpca / electron-webview-boilerplate Goto Github PK

View Code? Open in Web Editor NEW
9.0 5.0 1.0 205 KB

Quickly turn your Website, Web Application, Webpage into a usable Cross-platform, downloadable Desktop Application. Zero Configuration needed.

Home Page: https://github.com/zonayedpca/electron-webview-boilerplate/releases

JavaScript 16.39% PHP 0.44% CSS 72.12% HTML 11.05%
electron electron-js electron-app electron-webview electron-boilerplate electron-application

electron-webview-boilerplate's Introduction

Electron Webview Boilerplate

Quickly turn your Website, Web Application, Webpage into a usable Cross-platform, downloadable Desktop Application. Zero Configuration needed.

Requirements:

  • Travis CI Account(Make sure you allow Travis CI to build your respective repo)
  • GitHub access token(to be set as an environment variable in TravisCI)

Quick Start(Really Quick)

It's a template repo, so you can just simply make it yours by clicking on 'Use this template': usethistemplate Get your personal GitHub token from here with the scope of repo: newgithubtoken Login to TravisCI using your GitHub account and Set your GitHub token as Environment variable GH_TOKEN: setghtoken

If you like things manually...

Clone this repo:

git clone https://github.com/zonayedpca/electron-webview-boilerplate.git

Get inside of the cloned project:

cd electron-webview-boilerplate

Remove the remote origin

git  remote remove origin 

Create a new GitHub repo for yourself and set the remote origin as your GitHub repo:

git remote add origin ***YOUR_GITHUB_REPO***

Now push your project:

git push origin master

Get back to Travis CI and Find your repository. Then Go to More Options > Settings and Add your GitHub Personal Access Token(with scope of repo) as an Environment Variable GH_TOKEN.

Configuration

You must update your package.json file, atleast the repo url to deploy the release in your GitHub Release. Also You can update application name and other things from the same place. Once you update this file, TravisCI will automatically trigger a build. This build may take sometime(You can always see the live log from your TravisCI account). Once everything finished, you will get a see a draft release of your app into your GitHub repo.

Additionally, You can:

  • Add .html file as your app's UI
  • Or you can add your website to be shown inside your App
  • You can set up environment variables inside Travis CI to configure your App

Any changes you made on your repo, TravisCI will automatically trigger a build. Once a version of an App is released, any changes with the same version will not deploy any new release(as the version is same). If you want to release your updates, then please update the version from package.json, then only you will get to see new version released as a new draft once again.

Environment Variables

You can utilize these environment variable inside TravisCI(Same as setting GH_TOKEN that we have done just now): CLIENT: If you want to show your website inside the app. Simply put CLIENT environment variable with your website URL as value. Example: Key: CLIENT, Value: https://zonayed.me HEIGHT: To set the height of your app in px. Example: Key:HEIGHT, Value: 300 WIDTH: To set the width of your app in px. Example: Key:WIDTH, Value: 300

Roadmap

  • Add More Configuration
  • Automate the whole process

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.