Tapard
Tapard is an elegant real estate listing web application, diligently crafted to enable listing and renting of real estate properties. It simplifies the process of discovering, listing, and managing real estate properties with a streamline process to make reservations online.
Tapard is a dynamic and modern web application designed to streamline the process of finding and listing homes for rent. This project was developed using cutting-edge technologies, including React, Next.js, MongoDB, and Prisma, to create a seamless and user-friendly experience for both home seekers and property owners.
The app uses paystack as a means for secure payment, and security featues were implemented to make sure only authorized user can access their listings or reservations. The application UI was inspired from a design I saw on dribbble by Daffa Toldo which has a modern feel of Airbnb.
Key Features:
- User Authentication: Tapard ensures secure user authentication, enabling users to create accounts, log in securely, and manage their profiles. NextAuth enhances the authentication process, providing a smooth and secure user experience.
- Property Filtering: The application boasts a powerful real-time search feature that allows users to quickly find properties based on location, number of bedrooms, and other critical criteria. This feature ensures that users can effortlessly discover properties that align with their preferences.
- Property Listings: Property owners can easily list their real estate holdings for on rent. They can upload high-resolution images, provide comprehensive property descriptions, and specify important details.
- Secure Payment Integration: The project incorporates Paystack to enable secure online payments for property transactions. This feature simplifies the payment process and enhances trust between buyers and sellers.
- Properties Dashboard: Registered users access personalised dashboards where they can manage their listings, saved properties, and booked trips.
- End-to-End Testing with Cypress: Cypress is utilized to ensure the application's robustness and reliability through automated end-to-end testing, assuring a high-quality user experience.
Challenges Faced During Development:
During the development of this project,I encountered several challenges and successfully addressed:
- Deployment Complexity: Deploying the application on Vercel initially posed challenges due to outdated prisma client error from vercel. However, after researching the issue for a while, I realised that prisma generate script did not run when deploying, I had to add the prisma generate script to my vercel build script, ensuring a smooth deployment process.
- Paystack API Integration: Integrating the Paystack API required meticulous handling of environment variables. Specifically, setting the Paystack API key as NEXT_PUBLIC proved to be essential for seamless API communication. This challenge was overcome through careful configuration, api testing, going through the paystack docs and documentation.
- User Information Retrieval from Payment ID: Retrieving user information from the Paystack payment ID presented an additional hurdle. With creative problem-solving and API interactions, this challenge was successfully addressed, ensuring that payment-related data could be properly associated with users.