I create responsive, user-friendly web experiences with modern technologies, focusing on clean code and seamless interac

Ayush Shah  • Peerlist

FinanceCalc is a modern, responsive web application that provides a comprehensive suite of financial planning and calculation tools designed to help individuals make informed decisions about their investments and financial goals.<h3>🎯 Core Purpose</h3>FinanceCalc democratizes financial planning by offering free, accessible, and accurate financial calculation tools that help users understand their financial options and make better investment decisions. The platform serves as an educational and planning resource for personal finance management.<h3>📊 Key Features</h3><ul><li>SIP Calculator - Calculate Systematic Investment Plan returns and growth projections</li><li>Step-up SIP Calculator - Plan progressive investment strategies with annual increases</li><li>Income Tax Calculator - Compute tax liability under the new tax regime with detailed breakdowns</li><li>Inflation Calculator - Understand inflation's impact on purchasing power and real returns</li></ul><h3>🛠️ Technical Stack</h3>Built with cutting-edge web technologies:<ul><li>Frontend: React 18.2.0 with modern hooks and concurrent features</li><li>Styling: Tailwind CSS v4 for utility-first, responsive design</li><li>Build Tool: Vite 5.0.0 for fast development and optimized production builds</li><li>Routing: React Router DOM for seamless navigation</li><li>Charts: Chart.js for interactive data visualization</li><li>Animations: GSAP for smooth, performant animations</li></ul><h3>🎨 Design Philosophy</h3>The application features a sleek, modern dark theme UI with:<ul><li>Mobile-first responsive design that works flawlessly across all devices</li><li>Intuitive hamburger menu navigation for mobile users</li><li>Interactive charts and smooth animations for enhanced user experience</li><li>Accessibility-first approach with proper ARIA labels and keyboard navigation</li></ul><h3>🚀 Performance &amp; Deployment</h3><ul><li>Optimized for fast loading with modern build tools and CDN-ready assets</li><li>Deployed on Netlify with automatic deployments and global CDN distribution</li><li>SEO-optimized with proper meta tags and structured data</li></ul><h3>👥 Target Audience</h3>FinanceCalc serves individuals who want to:<ul><li>Plan their investments and retirement savings</li><li>Understand tax implications of their income</li><li>Calculate the real impact of inflation on their wealth</li><li>Make data-driven financial decisions</li></ul>

Financial Calculator

- Collaborated with a designer to understand the flow and animation requirements for the website.
- Developed a simple website using React.js, Swiper Sass and EmailJS.
- Integrated Swiper.js for carousel support in specific sections.
- Freelance project obtained through a friend.
- Enhanced skills in building visually appealing websites and ensured responsiveness across all devices.

Aonix Website

I developed the SchoolVR website, which provides a virtual reality experience for educational purposes. This project was built using React, Swiper, EmailJS, and also included a custom backend to handle various functionalities.

Key Features:

React Framework: Utilized React to create a dynamic and responsive user interface, ensuring a smooth and interactive user experience.

Swiper Integration: Implemented Swiper for touch slider functionality, enabling users to easily navigate through different sections and virtual experiences with smooth transitions.

EmailJS for Communication: Integrated EmailJS to handle email communication directly from the website, allowing users to send inquiries and receive responses without leaving the platform.

Backend Development: Designed and developed a custom backend to manage data, handle user authentication, and support the overall functionality of the SchoolVR platform. This backend was crucial for storing and retrieving user data, managing sessions, and ensuring data security.

Virtual Reality Experience: Created immersive VR environments to enhance the educational experience, making learning more engaging and interactive for students.

Project Duration: 2 month

This project allowed me to enhance my skills in both frontend and backend development, as well as gain experience in integrating third-party libraries and services. The SchoolVR website demonstrates my ability to build comprehensive web applications that combine innovative technologies for a better user experience.

School VR

I developed the TradeBattle website using React and GSAP, incorporating numerous features and properties to create a dynamic and interactive user experience. For styling, I utilized SASS to ensure a clean and maintainable codebase.

Key Features:

React Integration: Leveraged React to build a Single Page Application (SPA) with seamless navigation and real-time updates.

GSAP Animations: Utilized GSAP (GreenSock Animation Platform) extensively to create smooth and engaging animations, enhancing the overall user experience.

Entry and Exit Animations: Faced challenges in creating entry and exit animations for various components. After thorough research and experimentation, successfully implemented these animations using GSAP in combination with React, ensuring fluid transitions and a polished look and feel.

SASS for Styling: Adopted SASS (Syntactically Awesome Stylesheets) for styling, which provided powerful features such as variables, nested rules, and mixins, making the CSS more organized and reusable.

Project Duration: Approximately 2 months

This project was a significant learning experience, allowing me to deepen my understanding of React, GSAP, and SASS, while also honing my problem-solving skills. The TradeBattle website showcases my ability to deliver a complex, animation-rich web application from scratch.