Gakko - Digital Learning App

Introduction: Gakko - Digital Learning App

Requirements ---

Some experience in Javascript, CSS and HTML

A Linux, Windows, or MacOS Operating System

Installations ---

Install NPM and NodeJS

Install Visual Studio Code

Step 1: Pick an HTML Template That You Like

https://nicepage.com/html-templates

You can also do the frontend yourself if you'd like

Step 2: Learn to Program a Notes, Calendar, and Schedule Section in NodeJS

Here are guides on how to program each

Notes ---

https://www.w3schools.com/howto/tryit.asp?filename...

Calendar ---

https://fullcalendar.io/ (pre-coded)

Schedule --

Simply add your school periods in html and add an

[A href="" tag] (where square brackets are pointed ones, cant use on instructables since it interprets it as link)

to link to your zoom classes.

Step 3: Integrate All of the Features Into the Frontend

For more information on how to create NPM/Electron projects, view the following documentation:

https://www.electronjs.org/docs/tutorial/first-app

Using any text editor you'd like, I personally prefer Microsoft's Visual Studio Code, use the ready made HTML frontend you chose as the base for your NodeJS/Electron project, and add all of the elements discussed in the prior section to individual HTML pages (that you link from in your index page)

Step 4: Package Into an App

Open a command line in the root of your working directory, then type

```npm install electron-packager```

```electron-packager . [APPNAME]```

And your finished app should be in a folder in the same directory

Step 5: Buxfixing/Troubleshooting

If you're having trouble implementing any of the features, feel free to use my source code as a guide---

https://github.com/danielrousseaug/gakko

If you want to download and test my app, here is a download link for MacOS Users--

https://we.tl/t-LwrvQ1sDBI

Back to Basics Contest

Participated in the
Back to Basics Contest

Be the First to Share

    Recommendations

    • Back to School: Student Design Challenge

      Back to School: Student Design Challenge
    • Robots Contest

      Robots Contest
    • Retro Tech Challenge

      Retro Tech Challenge

    Comments