Set up the project

In this pull request, I have implemented a full stack Airbnb application, integrating key technologies such as Next.js, React.js, Typescript for the front-end, Node.js and Express.js for the backend, and MongoDB for data management. Additionally, I have configured the project thoroughly and ensured a successful installation.

To improve the quality of the code, I have incorporated linters, thus guaranteeing cleaner and more consistent development. This set of updates represents a significant step towards delivering a robust and efficient medical application.

Description:

As part of the user interface update, work has been done on the new functionality called Feature-Categories-UI. This feature focuses on improving the user experience when selecting room booking options by introducing specific categories that reflect various preferences.

Implementation Details:

One of the main improvements made is the addition of a new modal window when clicking on "Airbnb your home". This modal window presents a detailed selection of booking categories, allowing users to refine their preferences based on different aspects. Some of the categories include:

• Beach
• Windmills
• Modern
• Countryside
• Pools
• Lake
• Skiing
• Castles
• Camping
• Islands
• Arctic
• Cave
• Desert
• Barns
• Luxury

How does it work:

When interacting with the "Airbnb your home" option, the modal window with these categories is displayed, giving users the ability to refine their search for accommodations according to their specific preferences. This improvement not only diversifies the available options, but also simplifies the selection process, making the platform more intuitive and personalized.

Expected Impact:

The implementation of Feature-Categories-UI is expected to significantly improve the user experience by providing more specific booking options aligned with their interests. Furthermore, this addition not only makes navigation easier, but also contributes to the differentiation of the Airbnb platform by offering a more personalized approach focused on individual user preferences.

This issue is designed to track the development, testing and successful implementation of the Feature-Categories-UI, ensuring a smooth transition and improved user experience on the Airbnb platform.

Photo:

Description

As part of the development of the innovative Feature "22-Feature-Filters-Modal" for the Airbnb website, I am pleased to report on the successful implementation of various functionalities aimed at significantly improving the user experience when searching for properties.

Added Features:

• Advanced Filtering: Users can now customize their search based on their specific preferences, including location by country, length of reservation, number of guests, as well as specifying the number of bedrooms and bathrooms desired. This addition will allow users to refine their searches more effectively, optimizing the relevance of the results.

• Page Loader: A loading indicator (loader) has been implemented to improve the user experience during the search. This visual component provides real-time feedback, clearly indicating when the page is loading, contributing to a smoother and more transparent user experience.

• Error Handling: With the inclusion of an error component, users will now receive clear notifications in case the page does not load correctly. This proactive approach not only improves user confidence but also provides quick solutions to address potential charging issues.

• Improved Middleware.ts: The middleware.ts file has been expanded to cover all routes on the website, ensuring efficient and organized management of server requests and responses. This approach facilitates future expansion and ongoing maintenance of the site.

This implementation has been meticulously designed to not only meet user expectations, but also to elevate the overall quality of the Airbnb platform. I am available for any additional questions or necessary adjustments.

Description

With this new feature, users can now express their appreciation for specific properties by clicking the "like" button. Doing so will automatically add it to the user's favorites tab, giving them a quick and convenient way to access their preferred accommodations at any time.

The "13-Feature-Favoriting-function" not only simplifies the search for desired properties, but also provides an intuitive way to organize and manage favorite accommodation information. This feature has been designed with user comfort in mind, allowing for a more personalized experience focused on your individual needs.

It is no longer just about searching and booking, but rather creating a personalized space where users can keep an easily accessible record of their favorite accommodations. I continually seek to improve the user experience, and the introduction of the "13-Feature-Favoriting-function" is a significant step towards that goal.

Discover the convenience of organizing your preferences with the new favorites feature on Airbnb. Your next exceptional experience awaits you with just one click!

Photo:

Description:

As part of the continuous improvement of the user experience on the platform, work has been done on the implementation of a new key functionality for the “Airbnb your home” functionality. Specifically, an improved flow has been introduced for property location selection.

By moving through the offer creation process and clicking "Next" in the third window, a third modal window is now displayed intuitively and efficiently. This new modality is designed to share different images about the property, as many as the user would like.

This improvement not only seeks to optimize efficiency in property creation, but also to ensure a richer and more satisfying user experience by offering visual and intuitive images to show the number of amenities in the property quickly and efficiently.

Photo:

Description

I am pleased to present the new feature implemented in the system, called Feature-Categories-UI, designed to significantly improve the user experience when searching and booking accommodations. This innovative functionality incorporates an intuitive navigation bar that allows our users to explore and select their specific preferences when booking a hotel.

The Feature-Categories-UI gives users the ability to customize their accommodation search more precisely, through detailed categorization of various options. Now, users can choose from a wide range of categories, each tailored to their individual needs and preferences. Some of the featured categories include:

Location:

Near the beach
In the countryside
In the desert
In the mountain
In an island

Mod cons:

• With pool.
• Modern.
• Luxurious.
• Ideal for fishing.
• With ski facilities.

These categories allow users to refine their search based on their specific preferences, ensuring a highly personalized booking experience. By simply clicking on the desired categories, users can explore and select accommodation options that perfectly align with their individual expectations and needs.

The Feature-Categories-UI not only improves the usability of our platform, but also optimizes the user's time by offering more relevant options from the beginning.

Photo:

Navbar implementation for the "Airbnb Your Home" feature

Context:

As part of the continuous improvement of the user interface of the Airbnb website, the implementation of a new Navbar is proposed that optimizes the user experience when accessing key functions of the site.

New Feature Details:

Navbar elements:

Main Buttons:

• "Anywhere": Navigation to the accommodation search section in any location.

• "Any Week": Access to the search option based on flexible dates.

• "Add Guests": Facilitates the inclusion and management of information about the number of guests.

Search Button: Quick access to the search functionality.

"Airbnb Your Home" button:

• Located at the bottom of the Navbar, this button provides a shortcut for hosts who want to list their property on Airbnb.

User profile:

• Inclusion of the user's image in the upper right corner.
• Drop-down menu with “Sign In” and “Sign Up” options for a seamless and secure user experience.

Expected benefits:

• Improved navigability by providing shortcuts to essential functions.
• Increased visibility for the "Airbnb Your Home" feature, encouraging new hosts to participate.
• Simplifying the login and registration process.

Technical Considerations:

• The implementation must support different screen sizes to ensure a responsive experience.
• Maintain visual coherence with Airbnb's brand identity.

Proposed Steps:

• Navbar design with the mentioned elements.
• Integration of the Navbar into the user interface.
• Extensive testing to ensure functionality and stability.
• Request for review and feedback from the team.

Additional notes:

• Additional review and feedback from the developers and designers involved will be appreciated to optimize the implementation and ensure a smooth transition.

This issue seeks to significantly improve the user experience by providing an intuitive and efficient Navbar. Collaboration and feedback from the entire team are essential to guarantee the success of this new feature.

Description

I'm excited to introduce the exciting addition of the "20-Feature-Favorites-Screen" feature to the Airbnb website and mobile app. We have introduced "My Favorites" functionality to significantly improve the property browsing and selection experience.

With the newly created "Favorites" route integrated into the main menu of the application, users now have quick and direct access to a dedicated window that displays all the properties they have marked as favorites. This innovative feature has been designed to allow users to easily organize and review the properties that have captured their interest.

The "20-Feature-Favorites-Screen" offers an intuitive and attractive interface that gives users the ability to efficiently view each property they have saved in their favorites tab. By clicking on the "Favorites" option, users will be taken to an exclusive window where they can conveniently explore and manage all the properties they have marked for future reference.

This new feature not only streamlines the process of reviewing favorite properties, but also offers a more personalized and user-centric experience. Now, with a single click, users can access their selection of favorite properties, making decision-making easier and improving efficiency in planning their stays.

In short, the "20-Feature-Favorites-Screen" reflects my continued commitment to improving the user experience on Airbnb. I'm excited to offer this feature that makes managing favorite properties easier and more accessible than ever. Explore, save and organize your favorite properties with the new Airbnb favorites feature!

Description

I am pleased to report the successful implementation of the new feature called "21-Feature-Properties-Screen" on the Airbnb website. As an integral part of this innovation, we have introduced a key path called "Properties", which is now featured prominently in the application menu.

The "Properties" route has been carefully designed to provide users with an optimized experience when viewing and managing properties that are added by users of the Airbnb site. This functionality allows users to quickly and conveniently access a dedicated screen where they can fully explore each of the properties they have added to their favorites list with the intention of renting them.

This development responds directly to the needs and expectations of our users, significantly improving usability and efficiency in managing their property preferences. The inclusion of the "Properties" path in the app menu demonstrates our continued commitment to creating seamless and personalized user experiences.

Description:

As part of the continuous improvement of the user experience on the platform, work has been done on the implementation of a new key functionality for the "Airbnb your home" feature. Specifically, an improved flow has been introduced for property location selection.

By moving through the offer creation process and clicking "Next" in the first window, a second modal window now displays intuitively and efficiently. This new modal is designed to facilitate the selection of the country where the property is located, providing a more fluid and personalized experience for our users.

In the second modal window, users will find a search bar that dynamically filters the different countries in the world, simplifying the location process. Additionally, for more precise selection, an interactive map has been incorporated within the modal with a marker, allowing users to choose their specific location with greater precision and convenience.

This improvement not only seeks to optimize efficiency in the creation of listings, but also to ensure a richer and more satisfying user experience by offering visual and intuitive tools to define the location of your properties quickly and accurately.

Photo:

Summary:

This issue focuses on developing login functionality for our website, introducing a complete user experience by providing access to various custom sections once the user has successfully logged in.

Details:

Login:

• Create robust login functionality that allows users to securely authenticate to our site.
• Implement secure authentication methods, such as Auth with popular providers such as Google and GitHub.

User Area:

Upon successful login, users will have access to a personalized section where they can manage their experiences on our site.

Custom Sections:

• My Trips: Allow users to view and manage their previous and future trips.
• My Favorites: Offer a list of properties marked as favorites by the user.
• My Reservations (My Reservations): Show a summary of the reservations made by the user.
• My Properties: For users who are hosts, provide a section where they can manage their properties.
• Airbnb My Home: Provide personalized information about the use of Airbnb and your account.
• Logout: Implement a logout option to allow users to log out safely.

Technical Objectives:

• Use best security practices for storing and handling user credentials.
• Ensure a smooth and pleasant user experience throughout the login process and in custom sections.
• Integrate user design consistently with the overall appearance of the site.

Important notes:

• This new functionality is expected to significantly improve the user experience and encourage continued engagement on our site.
• Any additional improvements or adjustments suggested during development will be welcomed.

Description:

A new feature has been launched aimed at improving the registration functionality on the site. In this implementation, MongoDB, Prisma and Next Auth technologies have been incorporated to provide a robust and secure solution.

Changes made:

Added Technologies:

• Incorporated MongoDB as the main database for storing users and registration related data.
• Prisma was integrated to facilitate interaction with the database and speed up queries.
• Next Auth was implemented to manage user authentication and authorization efficiently.

New Folders Added:

- The following folders were created to organize the project structure:
- `api`: Contains the files related to the APIs and server logic.
- `libs`: Stores shared libraries and utilities.
- `prisma`: Contains files related to the configuration and use of Prisma.

Added Files:

- `schema.prisma`: Prisma configuration file that defines the database schema.
- `.env`: Environment file that contains the connection configuration to the MongoDB database and Next Auth.
- `prisma.ts`: TypeScript file to configure and use Prisma in the application.
- `route.ts` (located in the `api` folder): File that defines the routes and logic associated with the registration functionality.

Description:

I am pleased to introduce the latest addition to the user experience on Airbnb: the innovative "18-Feature-Trip-Screen" Feature. This feature is designed to offer our users more intuitive and complete access to their reservations, consolidating all relevant information in a single, accessible location.

The Trip route, now accessible from the application menu, provides users with a detailed view of each of their reservations. In this space, users will be able to easily and efficiently visualize all the crucial aspects of their planned stays.

Feature Highlights "18-Feature-Trip-Screen":

• Property Image: A visual representation of the reserved property is included, giving users a preview and familiarity with their choice.

• Location by Country: The new Trip route highlights the location of the property, offering key information about the country where the reservation will take place.

• Reservation Dates: From the start date to the end date of the reservation, users can easily view the exact period of their planned stay.

• Total Value per Night: The Feature "18-Feature-Trip-Screen" clearly and concisely shows the total cost of the stay, calculated according to the nights reserved.-

• Cancellation Button: For greater convenience, a cancellation button has been incorporated directly into the Trip route. This allows users to manage their reservations efficiently and easily.

With the "18-Feature-Trip-Screen" Feature, Airbnb continues its commitment to improving the user experience by providing more powerful and accessible tools for travelers to manage their stays effectively. I am excited to offer this enhanced feature and am confident that it will make travel planning and management even more convenient for our valued users.

We hope you enjoy the convenience and efficiency of the new Trip route on Airbnb!

Photo:

Description:

As part of the continuous development and improvement of the user experience on Airbnb, I am pleased to introduce the new functionality called "17-Feature-Reservation-functionality". This innovative feature has been carefully designed to optimize user interaction with the platform, offering a more intuitive and efficient booking experience.

In the individual view of each property, users can now access crucial information in more detail. A nightly rental value has been incorporated, providing a more transparent view of the costs associated with the property. Additionally, we have implemented an interactive calendar that facilitates reservations both by day and by range of days, providing flexibility and convenience when planning stays.

Displaying busy or available days on the calendar provides an instant view of property availability, allowing users to make informed decisions. For those interested in booking for multiple consecutive days, the feature also calculates the total price, ensuring a clear understanding of cumulative costs.

As a final touch, I have introduced a "book" button that simplifies the reservation confirmation process. By clicking this button, users can easily save their reservation, and to provide instant visual confirmation, we have included a toast window indicating that the reservation has been successfully made.

With this new functionality, I am looking to not only improve booking efficiency, but also elevate the overall user experience on Airbnb. We are committed to continuing to innovate and provide tools that make travel planning even more enjoyable and hassle-free for our users. Enjoy easy booking with Airbnb's "17-Feature-Reservation-functionality"!

Description:

I am pleased to share with you the successful implementation of the latest feature on our site, which significantly improves the user experience by facilitating the registration process. With the introduction of the new feature, clicking the “Sign Up” button displays an intuitive modal window that allows users to efficiently sign up for Airbnb.

This functionality offers our users the flexibility to choose between the traditional sign-up method, where they can provide their name, email, and password to create a custom account, or the option to use their Gmail or GitHub login credentials to simplify the process even more.

The inclusion of this diversified registration modality not only speeds up the incorporation of new users, but also reflects our commitment to accessibility and convenience. The intuitive interface and additional authentication options contribute to a more positive user experience, which can translate into higher retention and engagement.

New files created:

• useRegisterModal.ts
• Input.tsx
• Modal.tsx
• RegisterModal.tsx
• ToasterProvider.tsx
• Button.tsx
• Heading.tsx

Photo:

Description:

As part of the continuous improvement of the user experience on the platform, work has been done on the implementation of a new key functionality for the “Airbnb your home” functionality. Specifically, an improved flow has been introduced for property location selection.

By moving through the offer creation process and clicking "Next" in the second window, a third modal window is now displayed intuitively and efficiently. This new modality is designed to share some basic concepts about the property, for example about: What amenities do you have? How many guests are allowed? How many bedrooms do you have? How many bathrooms do you have? This provides a more fluid and personalized experience for our users.

_In this second modal window, users will find counters in each question to be able to count each one of them, this allows greater precision and comfort when entering information.

This improvement not only seeks to optimize efficiency in the creation of listings, but also to guarantee a richer and more satisfying user experience by offering visual and intuitive tools to define the number of your amenities in the property quickly and accurately.

Photo:

Description

As part of the continued evolution of the Airbnb site, I am pleased to introduce the exciting new functionality called "16-Feature-Listing-Reservation-Component". This enhancement focuses on optimizing the user experience by offering a more intuitive and efficient way to browse and book properties.

One of the main additions to this feature is the display of the cost per night in the individual view of each property. Users can now easily access the nightly price of their desired property, providing full transparency regarding associated costs.

In addition, I have implemented an interactive calendar that allows users to flexibly select booking dates. Whether booking by day or choosing a range of days, this calendar offers a seamless and customizable experience to meet users' individual needs.

Another notable feature is the ability to calculate the total price when booking multiple consecutive days. This functionality simplifies the booking process, giving users a clear view of the total cost of their planned stay.

To make the booking process even more accessible, I have incorporated a "Book" button. This button streamlines the booking flow, allowing users to confirm their choices quickly and easily.

In summary, the "13-Feature-Listing-Reservation-Component" is a significant addition to the Airbnb platform, designed to improve the user experience by providing detailed pricing information, flexible booking options, and an intuitive interface to facilitate the process backup. I am confident that this feature will improve user satisfaction when using Airbnb to find and book the perfect properties for their needs.

Photos:

Description

I am excited to introduce this innovative feature in Feature-Social-Login, designed to significantly improve the user experience by facilitating the process of logging in and accessing our platform. With this feature, users now have the ability to perform the Sign In and Log In process quickly and securely using their Gmail or Github accounts.

Key Features:

Easy Access:

Feature-Social-Login simplifies access to the platform by allowing users to use their Gmail or Github credentials to log in. This eliminates the need to remember additional passwords and speeds up the authentication process.

Reinforced Security:

Despite the ease of use, security remains our priority. The integration of Gmail and Github accounts meets the highest security standards, guaranteeing the protection of user information throughout the authentication process.

Improved User Experience:

By providing login options through widely used platforms like Gmail and Github, Feature-Social-Login improves user convenience and lowers barriers to entry, especially for those who prefer to use their existing credentials.

Instant Connection:

Direct connection to Gmail and Github accounts allows users to instantly access their profiles on our platform, streamlining the login experience and allowing faster access to essential features.

Feature-Social-Login represents the continued commitment to innovation and usability improvement, elevating user interaction to a new level. I'm excited to provide our users with a more convenient and secure way to access their accounts, paving the way for a more efficient and satisfying digital experience.

Description:

In the framework of the development of the new Feature called "13-Feature-Listing-Card" on the Airbnb platform, the creation of the first property card in the home section has been successfully achieved. This card is designed to offer users a visually appealing and efficient experience by providing crucial information about the properties available on the platform.

Technical details:

The listing card generated for this new functionality incorporates data extracted from the user database, thus guaranteeing updated and accurate information. The card offers a visual representation of the property by including images, highlighting the category to which it belongs, its geographical location and the rental price per night.

Implementation:

This work involves multiple technical aspects, among which the most notable are obtaining listings through server components, creating a specific component for the listing card, and implementing a direct action from the server to ensure a smooth and seamless experience. effective.

Achievements Achieved:

• Successful integration of property information from the user database.
• Design and creation of the listing card with attractive and descriptive visual elements.
• Implementation of direct server action to improve efficiency and response speed.

Photo:

Description:

I am pleased to announce the successful implementation of the new "13-Feature-Individual-Listing-View" feature on the Airbnb site, designed to significantly improve the user experience when browsing properties on the platform.

With this innovative functionality, users can now enjoy an individualized view by clicking on each property card from the home page. This unique experience offers a detailed view of the property, providing essential information to make informed decisions.

Highlighted Features of “13-Feature-Individual-Listing-View”:

• Property Name: We display the distinctive name of the property prominently, allowing users to easily identify the residence they are interested in.

• Location: The exact location of the property is clearly specified, providing users with the geographic information necessary to make decisions based on proximity to their preferred destinations.

• Property Image: A visually appealing image of the property is prominently featured, offering a visual preview that captures the unique essence of each location.

• Add to Favorites: Users can now add the property to their favorites list with a single click, making it easy to organize and later review their preferred options.

• House Owner: Information about the owner of the house is provided, establishing a more personalized and reliable connection between users and hosts.

• Guest Capacity: The maximum number of guests allowed when renting the house is clearly displayed, providing transparency into accommodation capacity.

• Number of Bedrooms and Bathrooms: Specific details on the number of bedrooms and bathrooms available provide a complete understanding of the property's layout and amenities.

• Category: The property is classified into a specific category, allowing users to filter and explore options based on their preferences and needs.

• Detailed Description: A comprehensive description of the property offers additional information about its unique features and quirks, providing a deeper understanding.

• Location Map: An interactive map is included that indicates the exact location of the property, allowing users to view its position in the context of their country of location.

With the "13-Feature-Individual-Listing-View", Airbnb continues to raise the bar for usability and personalization, giving our users an unparalleled experience when exploring and selecting their ideal accommodation. Welcome to a new era of discovery and convenience on Airbnb!

Photos:

Description:

As part of the continuous improvement of the user experience on the platform, work has been done on the implementation of a new key functionality for the “Airbnb your home” functionality. Specifically, an improved flow has been introduced for selecting the title and description of the property, and the last modal window created allows you to enter the rental price of the property.

By moving through the offer creation process and clicking "Next" in the fourth window, a new modal window is now displayed intuitively and efficiently. This new modality is designed to enter the title and description that the user wants, then when clicking next it allows them to set a fixed price for the rental of the property.

Photo:

Description

I am pleased to introduce the latest addition to the Airbnb experience: the "19-Feature-Reservation-Screen" functionality. In order to provide our users with a comprehensive view of their reservations, I have created the "Reservation" route that is now accessible in the application menu.

In this section, owners will find an intuitive interface that allows them to view all the reservations made by users for their properties. Attention to detail is paramount, and therefore each reservation includes essential information for owners to manage their accommodations efficiently.

Within the reservation screen, owners will be able to:

• View Property Images: A quick view of the reserved property, providing a visual representation that facilitates identification.

• Location by Country: The geographical location of the property is clearly presented, allowing owners to know the origin of their guests.

• Booking Details: From the start date to the end date of the booking, a complete schedule is provided so owners are aware of key dates.

• Total Cost per Night: For transparent financial management, the total value of the reservation is shown broken down, making it easy to track income.

• Cancellation Button: A strategically located button has been incorporated that allows owners to cancel a reservation if they wish, providing flexibility and control over the occupancy of their properties.

The "19-Feature-Reservation-Screen" functionality has been designed with convenience and efficiency in mind, providing owners with the necessary tools for effective management of their accommodations.