Fernando Presa's Developer Portfolio and Projects

Welcome to my developer portfolio! This is where I showcase a variety of projects I have worked on, including NextJS websites, React Native mobile apps, computer software solutions, and more.

I have a strong passion for creating digital solutions that are not only powerful and scalable but also easy to use. I invite you to explore my projects and see how I apply the latest technologies to tackle complex challenges.

Terminal button close macOS styleTerminal button minimize macOS styleTerminal button resize macOS style
NextJS Portfolio website, developed by Fernando Presa.

NextJS Portfolio Website

   Rebuilt with NextJS and Tailwind CSS, this website prioritizes speed and SEO while streamlining the development workflow and next-intl for internationalization.
  •   •  NextJS 14: Improved speed, SEO, and development workflows
  •   •  Next-intl: Support for multiple languages
  •   •  Metadata: Enhanced search engine visibility
  •   •  JSON Schema: Structured Data Markup in Google Search
  •   •  Custom 404 pages: User-friendly error handling
  •   •  Custom Middleware: Enhanced navigation and language selection
React Tech logoReact
Javascript Tech logoJavascript
NextJS Tech logoNextJS
Tailwind Tech logoTailwind
Next-Intl Tech logoNext-Intl
React Tech logoReact
Javascript Tech logoJavascript
NextJS Tech logoNextJS
Tailwind Tech logoTailwind
Next-Intl Tech logoNext-Intl
Terminal button close macOS styleTerminal button minimize macOS styleTerminal button resize macOS style
NextJS Jewelry Ecommerce Website, developed by Fernando Presa.

NextJS Jewelry Ecommerce Website

   This project elevates the Vercel Next.js eCommerce template into a custom-tailored jewellery shopping experience. From the various optimizations implemented throughout the development process this ecommerce website have a score of 100 at Google's Lighthouse tool for both mobile and desktop environments.
  •   •  Next.js 14.1.0 & Node.js 20: Harnessing the latest advancements for optimal performance.
  •   •  Tailwind CSS & TypeScript: Delivering a responsive design and robust type safety.
  •   •  Shopify Integration: Shopify GraphQL API for seamless e-commerce operations.
  •   •  Edge Runtime: Dramatically increases page speed worldwide enhancing experience for every corner of the world.
  •   •  Type Safety: Removing all generic ‘any’ types, and ensuring precise type definitions
  •   •  Security: Critical fixes, including safeguarding against the addition of $0 products via URL manipulation and discrepancies from product page and cart prices.
  •   •  Dynamic Open Graph (OG) Images: Boosts shareability and social media visibility.
  •   •  Dynamic Sitemap generation: Automatic creation of Sitemap.
  •   •  Continuous Content Freshness: Via webhooks and on-demand revalidation in response to Shopify store updates.
  •   •  Accessibility Enhancements: Makes the site more inclusive, broadening its reach.
React Tech logoReact
Javascript Tech logoJavascript
NextJS Tech logoNextJS
Tailwind Tech logoTailwind
React Tech logoReact
Javascript Tech logoJavascript
NextJS Tech logoNextJS
Tailwind Tech logoTailwind
Terminal button close macOS styleTerminal button minimize macOS styleTerminal button resize macOS style
React Native TravelogueLens IOS And Android, developed by Fernando Presa.

React Native TravelogueLens IOS and Android

   TravelogueLens, built using React Native, is designed to document and enhance users' travel experiences by transforming trips into easily accessible memories. The app does more than just organize photos—it offers valuable insights about visited locations.
   Key features for an enhanced user experience include exif data reading for precise location information, automatic fetching of address/city/country data, the display of interesting facts about visited cities/countries, nearby points of interest suggestions, a dynamic photo gallery, advanced filters, and an easy and fast navigation system.
   TravelogueLens is not just a testament to my technical abilities as a React Native developer, but it also represents my commitment to creating user-centric applications.
   The app technical features include:
  •   •  API Integration: I developed real-time data fetching for map images, locations, addresses, points of interest, reviews, ratings, and more. Firebase Functions are employed to ensure the security of runtime secrets.
  •   •  SQL Database Management: For efficient data handling, I integrated SQLite to locally store user data.
  •   •  Optimized Data Management: Implemented a strategic caching system to optimize the application's performance. This system saves data locally, reducing API calls and improving responsiveness.
  •   •  Filters: I incorporated advanced filter functionalities in SQLite database to promote scalability and performance on low-end phones and allow users to filter by country or city.
  •   •  Interactive UI/UX: The app offers an engaging and user-friendly interface. Using React hooks and performance-focused design principles, I worked to minimize user frustration and optimize navigation
  •   •  Exif Data Processing: The app reads the Exif data from the image, ensuring it fetches latitude and longitude from the picture taking into account the different ways different apps save the location of the photo, thereby boosting compatibility
  •   •  Permission Handling: The application carefully handles permissions for accessing the camera, photo library, and the user's current location. The user is fully informed about the permissions required, with an option to navigate directly to settings to manage them. This maintains transparency and respects user privacy.
  •   •  Firebase Functions: Chatgpt api key is being used on Firebase Functions, the app calls it with a prompt and gets the value of the prompt from Firebase Functions. The response is then stored in the database as a string.
ReactNative Tech logoReact Native
ReactNative Tech logoJavascript
Firebase Tech logoFirebase
Google-Apis Tech logoGoogle APIs
Google-Cloud Tech logoGoogle Cloud
Google-Reviews Tech logoGoogle Reviews
Maps Tech logo
Exif Metadata Tech logo
sqLite Tech logoSQL Lite
ReactNative Tech logoReact Native
ReactNative Tech logoJavascript
Firebase Tech logoFirebase
Google-Apis Tech logoGoogle APIs
Google-Cloud Tech logoGoogle Cloud
Google-Reviews Tech logoGoogle Reviews
Maps Tech logo
Exif Metadata Tech logo
sqLite Tech logoSQL Lite
Terminal button close macOS styleTerminal button minimize macOS styleTerminal button resize macOS style
Smart Image Shrink for macOS and Windows, developed by Fernando Presa.

Smart Image Shrink for macOS and Windows

   App developed in collaboration with a Neuroscientist, specifically engineered for image compression with emphasis on maintaining high image quality. It is tailored to ensure that the integrity of the images is preserved during the compression process.
   Smart Image Shrink is bundled into standalone executables for both macOS and Windows.
   Designed to be both user-friendly and powerful, employing state-of-the-art technologies to ensure optimal results of compression, you have options that range from quality retention to aggressive reduction of size.
   We effectively decrease the size by 99.77% from 1,56GB to 0,0036GB on a Mouse Brain sagittal cut microscopy image and you can see this Test Case and more on Smart Image Shrink github 🐭
  •   •  Process images in bulk: Reduce the size of all your images in one go and no quality loss.
  •   •  Multi-frame support: Convert Multi-Frame(s) to images and images to multi-frame(s).
  •   •  Metadata and exif integrity: Compress images while preserving their quality, metadata and data integrity.
  •   •  Multi-Threading: For high performance and increase in application responsiveness the processing process and the GUI work on different threads and therefore able to communicate between each other mid-processing.
  •   •  Performance&Time: Making use of multiple CPU cores for parallel execution of several images decreasing the execution time dramaticlly.
  •   •  Multi-Processing: Compress images in parallel on multiple cores while making sure each process have its own independent execution unit and memory space several images are processed at the same time and able to comunicate with the GUI when task is done.
  •   •  User Experience: Smart Image Shrink is user-friendly and easy to use the user gets feedback from the GUI console about the progress of the compression since start till the end and with a log.txt for analysis.
Python Tech LogoPython
GUI Tech LogoWX
Multi-Threading Tech LogoMulti-Threading I/O
Multi-Processing Tech LogoMulti-Processing
OS operations Tech LogoSystem Pathways
PyInstaller Tech LogoBundle App
Img Metadata Tech LogoMetadata
EXIF Tech Logo
EXIF Tech LogoImage Manipulation
Python Tech LogoPython
GUI Tech LogoWX
Multi-Threading Tech LogoMulti-Threading I/O
Multi-Processing Tech LogoMulti-Processing
OS operations Tech LogoSystem Pathways
PyInstaller Tech LogoBundle App
Img Metadata Tech LogoMetadata
EXIF Tech Logo
EXIF Tech LogoImage Manipulation
Terminal button close macOS styleTerminal button minimize macOS styleTerminal button resize macOS style
Java FullStack React Spring Boot, developed by Fernando Presa.

Java FullStack React Spring Boot

   This full-stack application is a customer dashboard where users can register, login, upload profile pictures, manage customer information, and access a small section of dashboard insights with customer info charts.
   One of the main highlights of this project is the significant emphasis on DevOps ensuring seamless integration, testing and AWS deployment.
   The application was built using a variety of technologies and best practices and security to ensure high quality, maintainability, and scalability
   The app technical features include:
  •   •  Local Testing Environment: Docker is used to create a local testing environment that matches the production environment as closely as possible. This allows for thorough testing and reduces the chances of environment-specific bugs.
  •   •  Automated Testing: Both the backend and frontend of the application have a suite of unit and integration tests. These tests are automatically run in GitHub Actions whenever a push is made to the repository, helping to ensure code quality and catch potential issues early.
  •   •  Automatic Deployment: The application is set up to automatically deploy after any push to the main branch, utilizing AWS Amplify for the frontend and AWS EC2 for the backend. This means any validated changes can be rapidly reflected in the live application.
  •   •  AWS IAM Policies: Implemented strict AWS IAM policies to manage access to AWS services and resources securely.
  •   •  SSH Key Usage: Utilized SSH keys for secure connection to production servers, demonstrating an understanding of best practices in secure server access.
  •   •  HTTP & API Development: The application exposes an API that the frontend consumes.
  •   •  Database & PostgreSQL: Used for efficient data storage and retrieval.
  •   •  Spring Data JPA and JDBC: Used for handling database operations.
  •   •  Flyway: For seamless database migrations.
  •   •  Unit Tests and Integration Tests: Tests have been written to ensure the functionality and integrity of the application.
  •   •  Docker: Used for containerization and deployment.
  •   •  AWS EC2 and Elastic Beanstalk AWS Amplify: Used for hosting the application in the cloud.
  •   •  GitHub Actions: Used for CI/CD, automated testing and deployment.
  •   •  User Registration & Login: Users can create an account and log in.
React Tech LogoReact
Javascript Tech logoJavascript
Java Tech logoJava
AWS Tech logo
Formik Tech logoFormik
JWT Tech logoJWT
SpringBoot Tech logoSpringBoot
Docker Tech logoDocker
ci/cd Tech logoCI/CD
React Tech LogoReact
Javascript Tech logoJavascript
Java Tech logoJava
AWS Tech logo
Formik Tech logoFormik
JWT Tech logoJWT
SpringBoot Tech logoSpringBoot
Docker Tech logoDocker
ci/cd Tech logoCI/CD
Terminal button close macOS styleTerminal button minimize macOS styleTerminal button resize macOS style
Visit my Github for more, developed by Fernando Presa.

Visit my Github for more

   With a range of projects showcasing my skills in various technologies and languages like Java, Spring Boot, JavaScript, TypeScript, React, React Native, NextJS, Redux, Node.js, MongoDB, GraphQL, Docker, PostgreSQL, AWS, Firebase, Python, CSS, styled-components, Web Security and more
   Looking for work
  •   •  Contact me: fernandodevemailjs@gmail.com
  •   •  Linkedin: linkedin.com/in/fernando-presa/