A Clean and Simple Startpage

⚠️ Disclaimer

I didn't develop the elements of this project, I just put the pieces of the puzzle together to make it work, based on what I would like to have. The changes made were made empirically. You will probably have better ways of doing what I did.

⭐ Based on:

• Bento of MiguelRAvila
• forismatic API from code example.
• Reddit API for random wallpaper.

Warning

You must check the licenses of the respective components if you wish to use any of them commercially.

✨ Features:

• Greetings = Are easy to change to your name.
• Quotes = Expressions to stimulate your thought or inspire your day.
• Weather Icons = Provided by Bento of MiguelRAvila.
• Weather = Provided by OpenWeatherMap.
• Random Wallpapers = Provided by Reddit API.

🎨 Customization

The files needed for editing below are contained in the js and css folder.

🌑 Colors and font size:

You can customize the font size and color via lines 4 to 8 of the style.css file.

⛈️ Weather Info:

To configure Weather you will need an API Key at: https://openweathermap.org/. Once you have your key, you will need to set your latitude and longitude, you can use: https://www.latlong.net/ to get them. Once you have the data, you will need to configure it in the weather.js file on lines 22, 30 and 31 respectively.

Important

If you don't like to have your API Key public (and Github discourages this publication due to security issues), you can make the repo into a private one. You can still use the Github Pages service or Netlify.

🌎 Weather Language:

You can set the language of weather conditions changing the variable in the line 2 on weather.js file.

See languages supported: https://openweathermap.org/current#multi

☁️ Weather Icons:

You can set the icon theme changing the variable in the line 5 on weather.js file:

• For example if you want the White icon theme, change the White to Nord.

👋 Greetings:

In line 5 until 9 of the greeting.js You can put your name and change the greetings translations messages for your language.

var myname = 'Ciro';
var lateTxt = 'GO TO SLEEP!!!';
var morningTxt = 'Good morning!';
var afterTxt = 'Good afternoon!';
var evenTxt = 'Good evening!';

🚀 Usage

🏡 As Home Page:

1. Fork this repo.
2. Enable the Github Pages service Settings » Pages » Source branch [main branch] » Save.
3. Or publish it to Netlify.

➕ As New Tab:

1. You can use different Extensions:

• If you use Firefox: Custom New Tab Page.
• If you use Chromium (Brave, Vivaldi, Chrome): Custom New Tab URL.

🐳 In a Docker Container

You can run this Simple Startpage in a Docker Container buildind your own imagem provided by Dockerfile included or via also included docker-compose file.

Docker Container Run

1. Clone this repo.
2. docker buildx build -t startpage .
3. docker run -d --restart=unless-stopped -p 8080:8080 startpage
4. The page will be available at the port 8080: localhost:8080

docker-compose

1. Clone this repo.
2. docker-compose -d up
3. The page will be available at the port 8080: localhost:8080

💻 Final appearance

🎁 Sponsoring

If you like this work, give me it a star on GitHub, and consider supporting it: