MERN Webapp with CentOS
The web application is responsible for managing the registration of new users on the Miniso Mexico platform. Its main functionality lies in receiving user data inputted via a form and registering it both in the VTEX e-commerce platform and the internal Aptos CRM, as well as storing it in MongoDB. This system is deployed on a CentOS server on-premises.
Webapp with Next.js, Tailwind CSS, and Vercel
This web application is designed to provide users with a platform to ask practical questions about wisdom and guidance for life. It is built with Next.js, Tailwind CSS, and is deployed on Vercel. The application is designed to be responsive and user-friendly, providing a seamless experience for clients.
Full-Stack ( Next.js - Nest.js, Finnhub API ) Stock Portfolio Tracker
The Portfolio Tracker application is designed to help users efficiently manage their stock holdings. It provides features to add, view, edit, and delete stock entries, track portfolio value in real-time, and display key metrics on a dashboard. Additionally, it includes user authentication (login, register, logout) and supports profile image uploads, stored securely in an AWS S3 bucket.
Java with Spring-Boot and MySQL, Angular 17 with Bootstap Full Stack app for Employee CRUD Management
This project is a full-stack CRUD application for managing employee data. The frontend is built using Angular 17 and Bootstrap, providing a user-friendly interface for creating, reading, updating, and deleting employee records. The application communicates with a Spring Boot backend API to perform CRUD operations on the employee data stored in a MySQL database. The project showcases proficiency in frontend development, RESTful API integration, and full-stack application architecture.
Craft custom forms with ease. Tailor your data collection to your exact needs.
Developed a comprehensive web application for customizable forms using Next.js, Nest.js, Next UI, MongoDB, and MongoDB Atlas. This application, inspired by Google Forms, empowers users to create and manage diverse forms, including quizzes, surveys, and polls. Key features include: Robust Backend: Leveraged Nest.js to build a scalable and maintainable backend API, handling user authentication, data storage, and business logic. Intuitive Frontend: Utilized Next.js and Next UI to create a user-friendly and performant frontend, enabling seamless form creation, customization, and submission. Secure Data Storage: Implemented MongoDB and MongoDB Atlas to securely store and manage user data, templates, and form responses. Efficient Deployment: Deployed the application to both Vercel and Railway, ensuring optimal performance and reliability. This project showcases proficiency in full-stack development, database design, and cloud deployment. It demonstrates the ability to build complex web applications that cater to various user needs.
Full-Stack Chat Application with Address Book, Text Chat, WebRTC Video Calls, and File Sharing Built with Next.js, Nest.js, Material UI, and MongoDB
Comprehensive chat application using a modern tech stack that includes Next.js, Nest.js, Material UI, MongoDB, and Mongo Atlas. The project was seamlessly deployed on Vercel for the frontend and Railway for the backend. The application includes the following key features: Address Book: Allows users to search and mark contacts as favorites for quick access. Text Chat: Supports rich text formatting and maintains chat history for a better user experience. Video Call: Integrated WebRTC for high-quality video calls, enhancing communication capabilities. File Sharing: Enables users to send files (iamges) easily within the chat interface. The project focuses on creating a user-friendly, visually appealing, and functional experience, aiming to offer a seamless chat and communication platform. With its sleek design and practical features, it is positioned to be both a portfolio highlight and a potential product for investment.
Real-Time Collaborative Presentation Software with Dynamic Slide Management, User Roles, and Advanced Drawing Tools Built with Next.js, Nest.js, and MongoDB
This project involved the development of a collaborative presentation software designed for real-time teamwork, allowing multiple users to create, edit, and view presentations simultaneously. Built using Next.js, Nest.js, Material UI, MongoDB, and Mongo Atlas, the application is fully functional and deployed on Vercel and Railway. Key Features: Real-time Collaboration: Users can join existing presentations or create new ones, with updates appearing instantly for all participants through WebSockets. User Roles: The presentation creator can assign user roles, allowing editors to draw on slides, while viewers can only view the content. Dynamic Slide Management: Editors can move and edit text blocks, with support for markdown formatting. The creator has full control over adding and removing slides. Persistent Data: All changes are saved permanently, ensuring that users who rejoin the presentation see the history of previous edits. User Interface: The app features a responsive, intuitive interface with a scalable slide area, tool panel for editing, and user list panel for managing roles. Advanced Functionalities: Drawing Tools: Multiple tools for adding shapes (rectangles, circles, arrows, etc.), with color customization. Undo/Redo Support: Users can easily revert changes during collaboration. Export Option: Presentations can be exported to PDF for easy sharing and printing. Gallery View: Presentations are filterable, searchable, and displayed in both table and tile formats, with pagination for better management. Slide Management: Auto-numbering, reordering via drag-and-drop, and slide renaming are all supported for efficient organization. Status Indicators: A status bar shows information about current editing activity and recent changes. This project demonstrates the ability to build a scalable, real-time, collaborative web application, leveraging modern full-stack technologies and ensuring a user-friendly, production-ready experience. The development team successfully incorporated live collaboration, persistent data storage, and an intuitive UI, all while focusing on performance and usability.
Full-Stack Application for Generating Realistic, Region-Specific User Data with Configurable Error Rates and Infinite Scrolling
This web application project leverages Next.js, Nest.js, Material UI, MongoDB, and MongoDB Atlas, with deployments on Vercel and Railway, to deliver a powerful tool for generating realistic, region-specific user data with customizable error rates. This tool is particularly valuable for testing data-handling capabilities in real-world scenarios. The application enables users to: Select a specific region (e.g., USA, Poland) for generating localized data, complete with names, addresses, and phone numbers formatted to match each region. Configure an error rate per record, emulating common data-entry mistakes through random character deletions, insertions, and swaps. Set a seed value to ensure that generated data remains consistent across sessions, with infinite scrolling that dynamically loads additional data as needed. The user interface updates in real-time to reflect any changes in configuration. Additionally, an export-to-CSV feature allows users to download the displayed data set, including all applied errors, in a format suitable for analysis. This project demonstrates advanced full-stack development skills in TypeScript and JavaScript, cloud-based deployment, efficient data manipulation, and dynamic user interface design. The application is a showcase of scalable data generation, error handling, and real-time updating within a robust, intuitive interface.
Secure User Administration Dashboard with Authentication and Role Management
Full-stack web development project using Next.js for the frontend and Nest.js for the backend, deployed on Vercel and Railway. The frontend interface was built with Material UI, providing a seamless and user-friendly experience. MongoDB was used as the database, ensuring scalable and flexible data management. The application includes a comprehensive user registration and authentication system, granting controlled access to an administrative dashboard. Only authenticated users can access user management features. The admin panel displays a user table with options for bulk actions—block, unblock, and delete users—using a toolbar with quick-action controls. Each user account has a designated status (active/blocked), ensuring that blocked users are unable to log in until reactivated. Implementation of a unique index in MongoDB for efficient data management and to maintain data integrity. This project showcases full-stack development skills in JavaScript/TypeScript, MongoDB, SaaS integration, and cloud deployment, demonstrating effective access control and security practices in modern web applications.
Basic Prototype PWA with Next.js
Corner Store App is a progressive web application (PWA) developed using Next.js and Nest.js, designed to serve small businesses or medium-sized corporations managing multiple branches, inventories, employees, and sales. It leverages AWS S3 for secure image storage, MongoDB Atlas for flexible data management, and uses JWT and bcrypt for secure user authentication and authorization. With an intuitive UI and responsive design, the app ensures optimal performance through server-side rendering and static site generation. The main goal is to provide a scalable, functional, and secure platform that can adapt to the evolving needs of businesses, enhancing user experience and operational efficiency.
Basic Prototype API with Nest.js
The Corner Store API is designed to handle the backend functionality of the Corner Store application. It is built with Nest.js and deployed on Railway. The API is designed to be scalable and efficient, providing a seamless experience for users.
Web Development Internship
During my internship at Prodigy, I had the opportunity to work on several key projects that significantly enhanced my web development skills. I developed a weather application integrated with the OpenWeather API, where I not only implemented real-time weather data retrieval but also optimized the user interface for a seamless experience. Additionally, I created a stopwatch and a Tic-Tac-Toe game using React.js, which honed my abilities in state management, component-based architecture, and responsive design. These projects provided me with practical experience in applying best practices in coding, debugging, and version control. Moreover, I gained valuable insights into effective collaboration within a team environment, learning to communicate clearly, manage tasks efficiently, and contribute meaningfully to group objectives. This internship solidified my passion for web development and equipped me with a strong foundation to tackle more complex challenges in the future.
API with Nest.js and Railway
API Documentation - ROR Overview This API is developed using NestJS, a progressive Node.js framework that allows the creation of scalable and efficient applications. The API follows SOLID principles to ensure maintainable and extensible code. It is designed to serve as the backend for several frontend applications developed with Next.js, including Estetica Pink, Endodoncista-Cuernavaca, and Pediatra-Cuernavaca. Additionally, the API integrates with Azure Blob Storage to manage and store large amounts of unstructured data, such as images and documents, ensuring scalable and secure file storage solutions. Main Modules AppModule The AppModule is the root module of the application, responsible for orchestrating and interconnecting the other modules. It is the foundation on which the application is built, allowing the integration of all services and functionalities provided by the API. AuthModule The AuthModule manages everything related to authentication and authorization of users. It implements a system based on JWT (JSON Web Tokens) to handle user sessions, ensuring secure access to the API's various routes and resources. User passwords are securely stored in the database using bcrypt for hashing, ensuring their confidentiality. UsersModule The UsersModule is responsible for managing the User entity, providing services for the creation, updating, retrieval, and deletion of users. This module is designed to efficiently handle the CRUD (Create, Read, Update, Delete) operations associated with the application's users, ensuring data integrity and consistency. VerificationModule The VerificationModule handles user verification, focusing particularly on email confirmation. It uses the Nodemailer tool to send verification emails to users, ensuring that only verified users can access certain functionalities of the application. ReviewsModule The ReviewsModule groups the necessary services for managing user reviews. This module allows users to create, update, retrieve, and delete reviews, providing a simple and efficient interface for handling feedback and ratings in the various applications that use this API. AzureBlobModule The AzureBlobModule manages the integration with Azure Blob Storage, providing a robust solution for storing and retrieving unstructured data such as images, videos, and documents. This module handles the connection to Azure services, enabling the API to efficiently upload, download, and manage files within the cloud, ensuring data is securely stored and readily accessible. Integration with Frontend Applications The API is designed to integrate efficiently with frontend applications developed in Next.js. Some of the applications currently using this API include: Estetica Pink: An application oriented towards the beauty and aesthetics sector. Endodoncista-Cuernavaca: A platform focused on managing appointments and reviews for an endodontics clinic. Pediatra-Cuernavaca: An application aimed at managing patients and reviews in a pediatric clinic. Technical Considerations Database: The API uses MongoDB as the primary database system, leveraging its flexibility and scalability to handle unstructured data. File Storage: Azure Blob Storage is used for managing and storing files, providing a scalable and secure environment for handling large volumes of unstructured data. Security: Best security practices are implemented, such as encrypted password storage and user validation through email. Architecture: The API follows a modular approach, making it easy to maintain and scale, allowing functionalities to be added or modified without affecting the overall system.
Greyball Challenge Solution
This project is an e-commerce application developed with Next.js and Tailwind CSS, designed to efficiently display a list of products while providing a modern user experience. The application includes several key features: Product Listings with Server-Side Rendering (SSR): It uses getServerSideProps to fetch data from an API, enabling quick product display to users, with a focus on optimized SEO. Responsive User Interface: The interface, built with Tailwind CSS, is fully responsive, offering a seamless experience across both mobile devices and desktops. Cart and Checkout: The application includes a shopping cart feature where users can add products, view the total items and price, all managed using Redux for centralized state management. Pagination and Infinite Scroll: It implements pagination for navigating through products, along with the option to load more products as the user scrolls down the page using IntersectionObserver. Product Filtering and Sorting: Users can search for products by title and sort the list based on criteria such as price or rating, with real-time updates to the results. Automated Testing: The project includes tests written with Jest and React Testing Library to ensure the stability and functionality of key components, such as the shopping cart. Redux for State Management: Redux is used for managing the application's state, ensuring that data like cart contents and user preferences are handled consistently and efficiently. This project serves as a comprehensive example of building a modern e-commerce application using current technologies, with a focus on efficiency, scalability, and user experience.
Webapp with Next.js, Typescript, Tailwind UI and Vercel
This Web Application is designed to provide users with information about the services offered by Estetica Pink. It is built with Next.js and deployed on Vercel. The application is designed to be responsive and user-friendly, providing a seamless experience for clients.
Webapp with Next.js, Typescript, Material UI and Vercel
This Web Application is designed to provide users with information about the services offered by Dra. Marha Iris Ocampo, pediatrician. It is built with Next.js and deployed on Vercel. The application is designed to be responsive and user-friendly, providing a seamless experience for clients.
PWA with Next.js, Typescript, Material UI and Vercel
The Progressive Web Application (PWA) is designed to provide users with information about the services offered by Dra. Berenice Ocampo, a dental specialist. It is built with Next.js and deployed on Vercel. The application is designed to be responsive and user-friendly, providing a seamless experience for clients.
PWA with Next.js and Vercel
The Progressive Web Application (PWA) is designed to provide users with a platform to share their secrets and read those of others. It is built with Next.js and deployed on Vercel. The application is designed to be responsive and user-friendly, providing a seamless experience for users.
API with Nest.js and Railway
The API is designed to handle the backend functionality of the Chismografo application. It is built with Nest.js and deployed on Railway. The API is designed to be scalable and efficient, providing a seamless experience for users.
Job search app with React
This web application is designed to help users find job opportunities based on their preferences. It is built with React.js, and is deployed on AWS EC2 using S3 bucket for Images. The application is designed to be responsive and user-friendly, providing a seamless experience for job seekers.
Basic login app with MERN
This web application, developed with the MERN stack (MongoDB, Express.js, React.js, Node.js), aims to showcase the basic functionality of a login system. In addition to allowing users to authenticate themselves, it also provides an intuitive and responsive interface to explore other potential features. Currently, it is deployed on an AWS EC2 instance, ensuring its availability and scalability.
Pediatric consultation app
This application is hosted on Vercel, with its primary function being to showcase information about a pediatrician and the services they offer. Developed using React.js and deployed on Vercel, the application is responsive and user-friendly, ensuring a seamless experience for clients.
Restaurant menu and services
This web application is designed to showcase the menu and services of Barbacoa Mena, a local restaurant. It is built with React.js, and is deployed on GitHub Pages. The website is designed to be responsive and user-friendly, providing a seamless experience for customers.
Dental clinic website
This website is designed to showcase the services and information of Dental Las Palmas, a local dental clinic. It is built with React.js, and is deployed on Vercel. The website is designed to be responsive and user-friendly, providing a seamless experience for clients.
Sale of chorizo and pork meat
This web application is designed to showcase the products and services of El Ranchero, a local store specializing in the sale of chorizo and pork meat. It is built with React.js, and is deployed on GitHub Pages. The website is designed to be responsive and user-friendly, providing a seamless experience for customers.
Game to test your knowledge
This web application is designed to test your knowledge with a trivia game. It is built with React.js, and is deployed on GitHub Pages. The game is designed to be responsive and user-friendly, providing a seamless experience for players.
Game to test your memory
This web application is designed to test your memory with a memory game. It is built with React.js, and is deployed on GitHub Pages. The game is designed to be responsive and user-friendly, providing a seamless experience for players.