Marino Linić's Portfolio

This Website [2024]

Technologies: Vite, React, TypeScript, Tailwind, MDX, ReCharts, Axios

The website you're scrolling through is my attempt at designing my own portfolio and blog. Hopefully, you like it.

Several mini projects are hosted: a portfolio blog, income tax calculator which visualizes distribution, and time counter using props. LocalStorage is used on the homepage. I also have a few hidden mini tools I'm working on.

Source code is available here.

---

Chronica Omnium — Curated History of the World [2023]

Technologies: Vite, React, TypeScript, Python, CSS, Leaflet, Plotly

This project is not complete, and isn't intended for screen sizes below 2000 px in width; I also momentarily excluded events prior to 753 BCE. The project displays one large JSON file compiled from a CSV I personally filled with over 500 historical events (goal: 2000) and over a dozen attributes with the purpose of making sense of world history. By compressing and prioritizing events, I can allow people to more easily have a general picture they can use as a reference frame for memorizing whatever other piece of historical information they encounter afterwards. Context is immensely pertinent for being able to retain information within a field.

I used Python scripts for Wikipedia scraping and much of the logic of a would-be backend, as well as some recursive algorithms to add some columns based on existing data, and then used React to display all of the data.

On the frontend side, I created features such as custom URLs (React Router's useParams hook), filtering options based on various attributes (you can see the options if you click on "Settings" on the page, like so), scrollbar page percentage counting, using props to send data to Plotly charts and Leaflet's maps, conditional showcasing, useState and useEffect hooks, and of course the existing CSS design.

Even though development is on pause, I am excited about this tool, and intend to use and promote it as an educational resource in the future.

The site is live at this URL. Source code is available here. You may see a very early XLSX version I uploaded online.

---

Income Tax Calculator [2023]

Technologies: React, ReCharts, TypeScript, Tailwind

[Screenshot is outdated.] This is an ongoing project I made to calculate my taxes in Croatia. I've made sure to do some input sanitization, and explained and visualized how the law works step-by-step. I've also visualized how the taxpayer is affected in various ways. This is by far the most feature-rich tool for income tax in Croatia. (Which, admittedly, doesn't say too much!)

You can try using the application here. (If you cannot return from the webpage, click the link at the bottom.)

Source code is available here.

---

2D Platformer - FIDIT Slayer [2023]

Technologies: JavaScript

A funny (to my friends and I) full-fledged one-level platformer game Dorian Manjarić and I made in pure JavaScript. It has a boss fight and everything; we were making some inside jokes about our university. I voice acted and made custom design for this, and created the main theme (music) using Omnisphere and FL Studio. You can watch my own playthrough here.

We made this game with a lot of OOP principles in mind. I would often jump in if there was a persistent bug during development, so I made and fixed our collision detection system and a few other key elements of gameplay. Otherwise, I was more focused on designing the game and optimizing code.

Play it here, but note the game is not responsive and doesn't work well on screens smaller than 2000 px in width. Source code is available here.

---

Django Insect Museum [2023]

Technologies: Django, Python

Along with Ivan Matejčić, I created a functional CRUD application that lets the user manipulate entries in Django for a fictional insect museum. Additionally, unit tests were created using django.test. Essentially, you can add or remove entries to indicate what specimens you have in your collection. It's a rudimentary application, however, with very few changes to the Django template.

This was a good opportunity for me to learn using Django. And, the name? It was my idea.

Source code is available here.

---

Naval Wars - Next.js Travian [2022]

Technologies: Next.js, React, TypeScript, Prisma, Tailwind, Next-Auth

I worked on this experiment with a good friend of mine, Kalciphoz, who created a successful Terraria mod: KRPG. We were both just getting into web development, and decided to embark on creating a Travian clone in Next.js to learn frontend web dev.

We created a login system via OAuth 2.0, a backend in Prisma with an SQL database, and a character selection screen. The project was deemed too ambitious, and Kalciphoz wanted to focus on his other interests whereas I needed to focus on finishing my university degree.

I learned a substantial amount about React and Next via this project. I was also taught some relevant coding principles by Kalciphoz, because there were files where my code was way more of a mess than it should have been.

The most difficult part was getting the backend to work and creating a good database model. At this time, I am unable to showcase communication with the database, but I can show one of the frontend elements that would have interacted with the backend: the character selection screen. It's quite shabby, but the proof of concept was thrilling back when this was my first working fullstack application. The user could select up to 10 characters and they would be saved to their profile.

Source code is available here.

---

C++ Clicker Game [2021]

Technologies: C++, SFML, Visual Studio

An original game I worked on with Marin Martuslović in C++ and the SFML library. All graphic assets were custom-made (font not included). The code was separated into 4 header files and 5 CPP files.

The game follows the typical incremental (clicker) game formula. Wealth is gradually acquired via simple clicking actions and the player can later buy and invest in passive income streams—in this case, "businesses." It is possible for the player to change their name and gender.

We found ourselves addicted to our own game, as did our professor. 😅

Source code is available here.

---

Flappy Bird Clone in the Browser [2021]

Technologies: JavaScript, HTML, CSS

An original flappy bird JavaScript clone Dorian Manjarić and I made in vanilla JS. This was an important milestone in my understanding of JavaScript. I also built a small stopwatch application as part of this phase of my learning.

Play it here. Source code is available here.

---

Photographic Studio [2020]

Technologies: HTML, CSS, JavaScript, Bootstrap 4

My first web project. A basic HTML/CSS website for a made-up photographic studio using Bootstrap 4. It includes Google Maps, a picture grid, a video, an image carousel, and fab icons. This is a web design oriented project, you can visit the site on the link below.

See it live here. Source code is available here.

---