Apartments Viewing

JavascriptTypescriptInfinite ScroolSuspenseJest +1
Source

This is the biggest problem I solved for an interview process,

It's a full blown apartment search, there are intermediate loading states, infinite scroll, image carrousels,

multiple api endpoints, reproducible search by url, image resizing on the server side


Strava Maps

GraphqlReactTachyonsRedisRedux +6
Source

This application leverages on the use of Strava API,

providing users custom visualizations of their own activities.

You may also opt to interact on mocked data if you are not willing to sync with your strava account (or if you don't have one).


Slick Slices

GatsbySanityReactCSS Grid
Source

This is the product of Wes Bos' Master Gatsby course. This was my first experience with both Gatsby and Sanity.

It gave me a very good understanding of how powerful those tools can be when put together.

Not only you develop faster, but also deliver something blazing fast.


Viewport

ReactD3DataReduxTypescript
Source

This was another interview task I had to fetch data about ports and vessels from an api

And organize them in a nice way. Each vessel contained information about logs on ETA over time,

so it was possible to calculate the average delay based on number of days before arrival.

Each also contained information about unloading time in their port stops, so that could be gathered in a port overview.


Trekkpedia

VueDockerAWSPostgisBootstrap +8
Source

The main idea behind this project was to experiment on Vue Framework.

But it grew way bigger than that, I started experimenting on state management with Apollo Link State,

linting with Wotan and even automated blue-green deploys on EC2 instances using docker images generated from the project.

It's a simple project, it shows the mountains around you, and tells you how far they are from your position and how high they are.


Django News

Django Rest FrameworkDjangoPythonReactWebpack +6
Source

In case you think the template is similar from this very website, you are totally correct.

I refurbished this django-news into this portfolio when studying Svelte.

But Django-News actually have a backend attached to it, so you can log in, filter your selection (and save your preferred selection) for reading the news.


The bubbles game

JavascriptES6ModulesCanvas
Source

When I heard about browsers supporting Javascript modules I saw really big potential in it.

It was, indeed, a very liberating experience to see your local changes automatically applied to localhost, no build steps needed.

This is a simple canvas pure vanilla JS game, written in MJS deployed to a server with no build steps.


React Redux Typescript

ReactReduxTypescript
Source

This is actually no big deal as a project itself,

but it is just an isolation of the initial boilerplate / configuration on a project with such stack,

therefore it just saves so much time on booting up a new project.


ReVue

GrapheneDjangoJWTVueWebpack +3
Source

No, it's not about the Revue dance, it's a Review application made with Vue 🤦🏻‍♂️.

This is a simple project, done in a few days for an application back in 2018.

It's a graphql API to write reviews / ratings, with user interface to list user specific reviews.


Playing with Canvas

ReactCanvasReduxStylus
Source

This is a simple geometry app using CreateReactApp to plot some geometrical forms on a canvas.

Each click on the canvas will update one of the three point references in a cyclic order (P0, P1, P2, P0, P1...). Each point is highlighted with a red circle.

After P0, P1 and P2 are set, the app calculates P3 so that, P0-P1-P2-P3 forms a parallelogram, which is ploted in blue.

Also it plots a yellow circle, which has the same area and centre of mass as the parallelogram.


Personal Blog

JavascriptTypescriptSvelteSapperMarkdown +2
Source

This blog was built with Sapper, server side rendering tool for Svelte,

an interesting, cool, new frontend framework I'm experimenting on lately.

The intent of having a blog is writing about technically interesting problems and solutions I've faced on the other personal projects I work on.