Ricardo Huaripata

This is my corner of the web, where I showcase my development projects and share my personal journey and experiences in web development, coding, and technology— all built with passion, dedication, and a love for continuous growth.

Hi 👋, I'm Ricardo, a web developer passionate about programming and technology.

A link management platform, allowing users to centralize and customize their web and social media links.

Gallery

### 🛠️ Tech stack

- [**Angular**](https://angular.io/) Angular is a front-end development framework developed and maintained by Google. It has been used in this project to build the dynamic and interactive user interface.

- [**TailwindCSS**](https://tailwindcss.com/) For the design and styling of the user interface, we use TailwindCSS, a highly customizable utility-first CSS framework. This approach allows us to create consistent and responsive designs efficiently, reducing the need for custom CSS and speeding up the development process.

- [**Spring Boot**](https://spring.io/) On the backend side, we implement Spring Boot, a Java framework that simplifies the development of enterprise-level applications. This framework enables us to develop scalable and secure RESTful APIs, ensuring a strong connection between the frontend and the database.

- [**MySQL**](https://www.mysql.com/) As a relational database, MySQL handles and stores the application's data. We chose MySQL for its reliability, high performance, and seamless integration with Spring Boot. Its robust structure and support for advanced SQL queries guarantee efficient data management.

- [**Cloudinary**](https://cloudinary.com/) Cloudinary is a cloud storage platform that allows efficient storage and management of images and videos. It has been used in this project to store user profile pictures.

---

You can explore the source code [here](https://github.com/ricardohuaripata/linkplaza-api)


Layout of Nike's official website using Astro and TailwindCSS. With Astro, I was able to generate a fast and efficient component architecture, ideal for high-performance websites. With TailwindCSS, I was able to create a very fast and optimal layout for a responsive web design for any device.

You can explore the source code [here](https://github.com/ricardohuaripata/nike-shop)

[Visit website](https://nike-online.netlify.app/)


Nike Shop

LinkPlaza

Modern ecommerce web application designed to provide a seamless shopping experience. The platform features a dynamic product catalog, a user-friendly shopping cart, secure payment integration, and a fully responsive design tailored for both desktop and mobile users.

This project is based on the page [OGS BRAND](https://www.ogsbrand.com/), a large part of the design of its user interface has been copied in order to skip the branding and design phase, thus being able to focus on the development of the backend and the frontend.

### 🛠️ Tech stack

- [**Angular**](https://angular.io/) Angular is a front-end development framework developed and maintained by Google. It has been used in this project to build the dynamic and interactive user interface.

- [**Bootstrap**](https://getbootstrap.com/) Bootstrap is a front-end design framework that facilitates the design and development of responsive and attractive web interfaces. It has been integrated into the project to enhance the appearance and user experience across different devices.

- [**Spring Boot**](https://spring.io/) Spring Boot is a Java application development framework that facilitates the creation of robust and scalable applications. It has been used in this project to build the RESTful API and manage the backend.

- [**PostgreSQL**](https://www.postgresql.org/) PostgreSQL is an open-source, highly extensible relational database management system. It has been used as the main database management system to efficiently store and retrieve data in the project.

- [**Stripe**](https://stripe.com/) Stripe is an online payment processing platform that allows merchants to receive payments securely and efficiently. It has been used in this project to implement the payment gateway and manage user payments.

- [**Amazon S3**](https://aws.amazon.com/s3/) Amazon S3 is an object storage service that allows efficient storage and retrieval of data in the project.

### Features

- 🛍️ Product catalog
- 🛒 Shopping cart
- 💳 Payment gateway
- 🔐 User authentication and registration
- 📝 User information management
- 📋 Order history
- 🔑 Password recovery
- 📫 Email notifications
- 📱 Responsive design
- 🌍 Multilingual

---

You can explore the source code [here](https://github.com/ricardohuaripata/spring-ecommerce-api)


Layout of the official website of Vanquish Fitness, an online fitness clothing store. Created with the purpose of improving my web layout skills with the help of the Tailwind CSS framework. With Tailwind CSS I managed to create a very fast and optimal layout for a responsive web design for any device.

You can explore the source code [here](https://github.com/ricardohuaripata/vanquish-fitness)

[Visit website](https://vqfit.netlify.app/)


Vanquish Fitness

Advanced ecommerce web application that enhances the shopping experience with powerful features. In addition to a dynamic product catalog, intuitive shopping cart, and secure payment integration, this application includes a robust review system for user feedback and a favorites list for saving preferred items.

### 🛠️ Tech stack

- [**Angular**](https://angular.io/) Angular is a front-end development framework developed and maintained by Google. It has been used in this project to build the dynamic and interactive user interface.

- [**Bootstrap**](https://getbootstrap.com/) Bootstrap is a front-end design framework that facilitates the design and development of responsive and attractive web interfaces. It has been integrated into the project to enhance the appearance and user experience across different devices.

- [**NodeJS**](https://nodejs.org/) NodeJS is a JavaScript runtime environment that allows executing JavaScript code on the server. It has been used in this project to build the RESTful API and manage the backend.

- [**ExpressJS**](https://expressjs.com/) ExpressJS is a Node.js framework that facilitates the development of web applications and RESTful APIs. It has been used in this project to build the RESTful API and manage the backend.

- [**MongoDB**](https://www.mongodb.com/) MongoDB is a NoSQL database that allows efficient storage and management of data. It has been used in this project to store the application's data.

- [**Stripe**](https://stripe.com/) Stripe is an online payment processing platform that allows merchants to receive payments securely and efficiently. It has been used in this project to implement the payment gateway and manage user payments.

- [**Cloudinary**](https://cloudinary.com/) Cloudinary is a cloud storage platform that allows efficient storage and management of images and videos. It has been used in this project to store product images.

### Features

- 🛍️ Product catalog
- 🛒 Shopping cart
- 💳 Payment gateway
- 🔐 User authentication and registration
- 🔐 Sign in with Google
- 📝 User information management
- ⭐ Product reviews
- 🧡 Favorites list
- 📋 Order history
- 🔑 Password recovery
- 📫 Email notifications
- 📱 Responsive design

---

You can explore the source code [here](https://github.com/ricardohuaripata/ASHON-Ecommerce-API)


ASHON Ecommerce

Og's Ecommerce

Projects

Choosing a tech stack is one of the most important decisions when starting any web development project. Throughout my journey as a developer, I have experimented with various tools and languages, but I have finally found a stack that combines productivity, scalability, and ease of use: Spring Boot, MySQL, Angular, and TailwindCSS. In this post, I want to share the reasons behind my choice and why I believe this stack is an excellent option.

## Backend: Spring Boot

Spring Boot is the cornerstone of my backend. This Java-based technology offers a robust and flexible framework for building modern applications. Here are the main reasons why I chose it:

- Productivity: Spring Boot eliminates much of the tedious configuration associated with traditional Java projects thanks to its auto-configuration features. This allows me to focus on business logic without worrying about complex setup tasks.

- Scalability: Its modular architecture gives me confidence that my application can grow and handle a high volume of users without sacrificing performance.

- Community and Support: Spring Boot has a very active community and exceptional documentation. This means that if I encounter any issues, there is likely already a solution or resource available.

- Integration with Enterprise Tools: It is ideal for applications that need to connect to enterprise systems, handle complex transactions, or integrate REST services efficiently.

## Database: MySQL

For the data layer, I chose MySQL, one of the most popular relational databases in the world. The reasons for this choice include:

- Reliability: MySQL is known for being stable and reliable, even in high-demand production environments.

- Ease of Use: Its syntax is simple and familiar, enabling me to manage and query data efficiently.

- Compatibility with Spring Boot: Spring Data JPA makes it easy to integrate MySQL with Spring Boot. This allows me to interact with the database using an object-based API, saving time and effort.

- Documentation and Community: Like Spring Boot, MySQL has extensive documentation and an active community, ensuring that any questions can be resolved quickly.

## Frontend: Angular

On the frontend side, my choice was Angular, the development framework maintained by Google. Here’s why Angular is my go-to tool:

- Robust Structure: Angular provides a component-based approach and strong typing with TypeScript, which helps keep code organized and scalable.

- Support for Complex Applications: Angular is perfect for building rich, interactive user interfaces. Its modularity system enables me to manage large projects without losing control.

- Two-Way Data Binding: The automatic synchronization between model and view makes interactions smooth and reduces the amount of required code.

- Ecosystem and Tools: Angular CLI, its command-line interface tool, speeds up development with component generation, services, and built-in testing support.

## Styling: TailwindCSS

For styling, I chose TailwindCSS, a utility-first framework that allows me to design clean and modern interfaces quickly. Here are the reasons behind this choice:

- Utility-Based Design: Instead of writing CSS from scratch, Tailwind provides predefined classes that can be combined to achieve any design effortlessly.

- Development Speed: By using utility classes, I can test and adjust styles directly in the HTML code without switching between CSS files.

- Visual Consistency: Tailwind includes a predefined design system with typography, colors, and spacing, ensuring the interface remains consistent.

- Flexibility: While it comes with default values, everything can be customized to fit the project’s needs.

## Final thoughts

Choosing a tech stack is no trivial decision. It requires considering the project’s needs, community support, learning curve, and market trends. For me, this stack has been a solid choice, and I hope this post has inspired or provided you with ideas for making your own tech decisions. Thanks for reading!


How I chose my tech stack and why

How I chose my tech stack and why 🛠️

Every developer’s journey is unique, shaped by the challenges faced, the tools learned, and the projects built. Mine began in a structured environment: an Advanced Technical Degree in Web Application Development. Over two years, I transitioned from a complete beginner to a full-stack developer, learning the foundational principles and advanced technologies that now form the backbone of my career. Here is my story.

## Year 1: Building the Foundations

The first year of my program was all about mastering the basics. This was the stage where I learned what development really entails and began building the foundation for my future skills.

#### Programming in Java

I started with Java, which introduced me to core programming concepts like object-oriented programming, data structures, and algorithms. Java’s versatility and widespread use made it a great starting point, and it also prepared me for backend development down the line.

#### Databases and SQL

Understanding how data is stored, managed, and queried was another key milestone. I dove into SQL and database design, learning how to create schemas, write complex queries, and optimize data storage—skills that are essential for any developer.

#### HTML and CSS

Web development began with HTML and CSS, the building blocks of any website. I explored how to structure content and style it effectively, laying the groundwork for more complex frontend frameworks I’d encounter later.

#### Software Lifecycle

I also studied the software development lifecycle, gaining insight into how professional software projects are planned, executed, and maintained. This knowledge was invaluable for understanding the big picture of how applications come to life.

#### Systems and Docker

One of the most exciting parts of the first year was learning about systems administration and tools like Docker. Containerization introduced me to modern development workflows, enabling me to set up isolated environments and simplify deployments. This was my first taste of how powerful DevOps practices could be.

## Year 2: Becoming a Full-Stack Developer

The second year was where everything came together. This was the time to specialize, deepen my knowledge, and combine the backend and frontend skills to build complete applications.

#### Backend Development with Spring Boot

Building on my Java foundation, I learned Spring Boot, a powerful framework for creating robust and scalable backend applications. I became proficient in building RESTful APIs, handling authentication, managing databases, and implementing business logic.

#### Frontend Development with Angular

On the frontend side, I learned Angular, which transformed how I approached user interfaces. Angular’s component-based architecture, combined with TypeScript, enabled me to create dynamic, responsive, and maintainable web applications.

#### Web Application Deployment

One of the most critical skills I gained was web application deployment. I learned how to host applications on servers, manage domains, and ensure that projects were accessible to users. This included working with build tools and automation processes to streamline deployments.

#### Cloud Computing

Finally, I explored cloud computing, which opened the door to scalable, flexible infrastructure. Learning how to deploy and manage applications in the cloud helped me understand modern hosting solutions like AWS, Azure, and Google Cloud, preparing me for real-world scenarios.

## Specializing Through Personal Projects

After completing my formal education, I knew the journey didn’t stop there. To further strengthen my skills and gain hands-on experience, I started working on personal projects. These projects allowed me to:

- Deepen my backend expertise: I built APIs with Spring Boot, experimenting with advanced features like custom security implementations, complex query optimizations, and performance tuning.

- Enhance my frontend skills: Using Angular, I created dynamic, responsive web applications, honing my ability to design intuitive user interfaces and manage state effectively.

- Improve my deployment process: I practiced deploying projects using Docker and cloud platforms, focusing on automating workflows and improving scalability.

These personal projects not only solidified my technical knowledge but also helped me understand how to solve real-world problems creatively and efficiently.

## Final Thoughts

Becoming a full-stack developer is not just about learning technologies; it’s about understanding how to connect them to create seamless experiences. My formal education provided a structured path, but it was the curiosity and dedication to go beyond the classroom that truly defined my journey.

If you’re starting out, remember: every expert was once a beginner. Focus on building a strong foundation, embrace challenges, and keep pushing forward. The results are worth it!


Hi 👋, I'm Ricardo, a web developer passionate about programming and technology.

LinkPlaza

Og's Ecommerce

ASHON Ecommerce

How I chose my tech stack and why 🛠️

My journey from beginner to full-stack developer 👨‍💻

Let’s talk... 💬

Ricardo Huaripata | Full Stack Developer

Hi 👋, I'm Ricardo, a web developer passionate about programming and technology.

LinkPlaza

Og's Ecommerce

ASHON Ecommerce

How I chose my tech stack and why 🛠️

My journey from beginner to full-stack developer 👨‍💻

Let’s talk... 💬