FREDDIE SANDOVAL

Creating a Sharing file app

See the demo at qim.fredy.dev or check the CODE in GitHub

The problem to be solved:

I can be a real pain when you try to move pictures or files from your phone to your computer and the other way around and also share files to another person across the internet.

Project Description:

Qim.link is a fullstack project that allows users to upload files to the server and this creates a sharing link, if a picture is load the server will create a thumbnail for each picture, the service also allows the users to download all the files in a zip, or only download individual files.

Highlights of the project:

• I created the little animation in Blender.
• It uses a small database to store information.
• Show previews for the image files.
• All through HTTPS.

Technologies used:

• Blender (Graphics)
• NodeJS (Backend)
• Vue3 (Fronend)
• LowDB (Database)

Building a data base micro service

See the demo at microdb.fredy.dev or check the CODE in GitHub

The problem to be solved:

Sometimes you want to store something really small, like a score counter, a views, or likes, but building an entire infrastructure just for something small may not be worth it.

Project Description:

MicroDBs is a microservice that allows users to create collections and store data in it. It also has a schema validation, to prevent unwanted data.

Highlights of the project:

• I built the Front-end, Back-End and Graphics.
• The database is capable to handle hundreds of collections.
• Users can add their own schema.
• uses HTTPS

Technologies used:

• Blender (for the graphics)
• NodeJS (for Back-end)
• Vue, Vite, VitePress (Site Generator)
• Hosted on Google Cloud Platform (virtual machine)

Building a documentation Site from scratch.

See the demo at drive.fredy.dev or check the CODE in GitHub

Problem to be solved:

The Google documentation API is quite hard to understand for general people, so I decided to create my own documentation with simplicity in mind.

Project Description:

In this project I built a documentation site called "Google Drive API Guide" which is site that provides information and instructions on how to use the Google Drive API to interact with the Google Drive service.

Highlights of the project:

• All the documentation code was create by me.
• I learned very deeply how the Google Drive API works.
• I was able to fully understand the NodeJS API created by Google.
• I created my own image graphics.
• I fully understand how the authentication of Google APIs works.

Technologies used:

• Blender (for the graphics)
• Vue, Vite, VitePress (Site Generator)
• Netlify (for deployment)

Various CSS examples Project

See the DEMO or check the CODE in GitHub

Description:

In this project I create some animations using css only.

Highlights:

• I consider myself a css expert
• Pure CSS animations
• Develop confidence on CSS

Building a DarkButton

See the DEMO or check the CODE in GitHub

You can also click the example right next.

Problem to be solved:

This project was developed for a client with the following especifications:

• Fix the flickering bug the existing darkbutton had.
• Button state survive page reload.
• Respect user system prefered mode.
• Easy to addapt to existing CSS.
• Must be built in Svelte

Creating My own blog from ground up.

See the demo at fredy.dev or check the CODE in GitHub

Problem to be solved:

I wanted to have my own blog but with my specific style and beahvior.

Project Description:

A blog site built from ground up.

Highlights of the project:

• Here is an article I feel proud of: Which Programming is faster at reading?
• All articles are original.
• I learned a new technology.
• Full SEO compliant.
• Three-state darkmode button (light, dark, purple)

Technologies used:

• Jekyll (Static Site Generator)
• Netlify (for deployment)

Creating a Tube video site.

See the demo at tube.fredy.dev or check the CODE in GitHub

Problem to be solved:

I wanted to have a place to store all my favorite watched YouTube videos, and also keep practicing my coding skills.

Project Description:

Is a site that behaves like a vide Tube site with tags.

Highlights of the project:

• Static site (no server).
• All my favorite videos in one place.
• fully customizable.

Technologies used:

• Jekyll (Static site Generator)
• Netlify (for deployment)

Creating a Tube video site.

See the demo at Netlify, Source code is not available.

Problem to be solved:

How to build a Snake game only with vue logic.

Project Description:

It's a game wich logic was made with VUE 3 only, and made with HTML components and Javascript.

Highlights of the project:

• Great project to master VUE 3
• HTML, JavaScript only.
• VIM keys for snake movements.

Technologies used:

• VUE 3 (Framework)
• Netlify (for deployment)

Various Illustrations.

Project Description:

This a small collection of tech illustration that can be used in different ways.

For more illustrations visit this: Post 1, Post 2

Technologies used:

• Blender (3D software)