Introduction

Want to learn something new? But don’t know what? This small project is for exactly this situation. It will give you a random suggestion. It can be a more theoretical or practical thing, a very niche, specific or a very broad thing, something useful or fun - Maybe even something that will surprise/interest you!

WhatToLearn Website
WhatToLearn Github

Motivation

Because of another project, I have recently been looking into Tauri, which allows building multi-platform apps. As Back-End, it uses Rust and as Front-End, it allows various different options based on Javascript/Typescript. Since I was not very familiar with either, I wanted to start learning the Front-End part by doing a fun, short project. A project that I could host as static website. And I have decided to create What To Learn/Learn Something New.

I really like learning and I think it is important to never stop. But sometimes all the options can be overwhelming. To make the decision easier, this web app gives suggestions based on how much time/money you want to spend, seemed like a nice solution - and a great way to learn a new set of technologies.

How to use it

You visit the WhatToLearn Website, click the ‘I want to learn something new!’ button, then select the categories you are interested in, the time you want to spend and how much money you want to spend. And then you’ll already get a suggestion!

Additionally, you can learn about the statistics of the currently offered suggestions.

And if you have any more suggestions that other people should learn, you can check out the Github Page of this project or contact me with you suggestions.

Implementation

Ok, now let’s talk a little about how I developed it. What programming languages, frameworks and technologies did I use? And how did I program it?

As already mentioned, because I wanted to learn a Front-End technology to use for Tauri, I decided to use Angular. It is a web development framework that, from my experience, is very intuitive and easy to learn. It uses HTML, CSS and Typescript to build components into a full web app. As previously mentioned, you can find the code on my Github.

What I liked about Angular is that it allows me to structure my program into components. And it also allows redirection and sending data between the components. This allowed me to easily split the selection of category/time/money and display them after each other. Angular also makes it easy to display Typescript array and list elements in different HTML tags, which I made heavy use of. I also decided to display statistics of the possible suggestions, mainly as an overview for myself. It allowes to see where I could come up with some more suggestions. But I also thought some of you might also be interested in it.

Finally, since I didn’t want to create a Back-End, for which I would have needed to host the project on a server, I needed a way to statically include a list of suggestions with categories, estimated times and estimated expense. Since this meant no database, I decided to use a JSON file. This worked very well since I knew the amount of suggestions would be manageable and it was easy to parse and use in Typescript.

To host the website, I used Github Pages and a subdomain of my website, where I also host this blog. The combination of Github Pages and Angular also allowed for easy deployment of the production build to the ‘gh-pages’ branch. The tool that made this possible is angular-cli-ghpages.

Conclusion

This was a fun little project. I learned a new Front-End framework that allows me to build upon the gained knowledge for my next bigger project. Additionally, while collecting suggestions of what to learn I found a lot of interesting new things and cannot wait to learn some of the suggestions.

Please try the website and let me know what you have decided to learn. You can also tell me what you think is a great new thing people should learn!