Git Product home page Git Product logo

gauravsingh1281 / rentalog-rent-management-web-app-for-landlords Goto Github PK

View Code? Open in Web Editor NEW
25.0 1.0 47.0 4.08 MB

Rentalog || Free Rent Management Web App For Landlords. With Rentalog, landlords can keep track of important information about their renters, including their names, addresses, and rental payment history.

Home Page: https://visionary-fenglisu-db1b1d.netlify.app/

License: MIT License

JavaScript 92.74% HTML 2.04% CSS 5.22%
beginner-friendly open-source javascript reactjs hacktoberfest hacktoberfest-accepted

rentalog-rent-management-web-app-for-landlords's Introduction

Rentalog - Rent Management Web App For Landlords 🏠

Rentalog is a user-friendly web application designed to simplify the management of rental properties for landlords. With Rentalog, landlords can effortlessly keep track of crucial tenant information, such as names, addresses, and rental payment history. This data is securely and neatly organized, ensuring landlords have easy access whenever they need it.

In addition to tenant management, Rentalog streamlines rent collection, making it a breeze for landlords to keep tabs on monthly payments. This enables landlords to maintain a clear understanding of their rental income, facilitating informed business decisions.

πŸš€ Features

  • Tenant Management πŸ’Ό: Seamlessly organize tenant details, including names, addresses, and rental payment history.
  • Rent Collection πŸ’Έ: Collect and monitor monthly rent payments with ease.
  • Rent Calculations πŸ“Š: Automatically calculate total monthly rent received and view payment breakdowns.
  • Property Listing 🏘️: Showcase your rental properties and attract potential tenants through Rentalog listings.
  • User-friendly Interface πŸ§‘πŸ»β€πŸ¦³: Intuitive and easy-to-navigate interface for quick access to information.
  • Dedicated Support Team πŸ“²: Reach out to Rentalog's support team for assistance and guidance.

πŸ“¦ Current Version Tech Stack

Rentalog is built using the following technologies:

  • React βš›οΈ
  • Tailwind 🎨
  • Node.js βš™οΈ
  • Express.js πŸš€
  • Embedded JavaScript (EJS) 🌐
  • MongoDB πŸ“¦
  • Mongoose πŸ“¦
  • Passport.js πŸ”

πŸ› οΈ Migration to React.js and Next.js

We are now seeking contributions for the migration of Rentalog's tech stack to React.js and Next.js. This migration offers several advantages:

  • Performance Boost πŸš€: React.js enables efficient rendering and updates, resulting in a snappier and more responsive user interface.
  • Enhanced User Experience 🌟: Interactive components can be built, providing a seamless and engaging user experience.
  • Code Maintainability πŸ”§: React.js promotes a component-based architecture, making the codebase modular, reusable, and easier to maintain.
  • Server-side Rendering 🌐: Next.js introduces server-side rendering, leading to faster initial page loads and improved SEO.
  • Scalable State Management πŸ“ˆ: React.js, combined with libraries like Redux or React Context, offers efficient state management.
  • Rich Ecosystem βš™οΈ: Migration opens up a vast ecosystem of tools, libraries, and community support for future development and enhancements.

🀝 How to Contribute

We welcome contributions from the open-source community to assist with the migration. Here's how you can get involved:

Found an issue on our app?

Raise an issue: You can raise an issue for that. And our smart contributers will fix that issue for you.

Have a feature idea in your mind?

You can propose a feature by raising an issue. But before that make sure the feature isn't proposed already in OPEN or CLOSED issues.

Want to contribute by coding?

  1. Fork: Star the repository and then fork the repository by clicking the "Fork" button in the upper right corner of this page.
  2. Clone: your forked repository to your local machine:
    git clone https://github.com/your-username/Rentalog-Rent-Management-Web-App-For-Landlords.git
    
  3. Enter the source directory:
  4. cd Rentalog-Rent-Management-Web-App-For-Landlords
    
  5. Install project dependencies:
  6.  npm install
    
  7. Add the changes you made You could either use this to add all the changes you made
    git add .
    
    or, you could specify the files you want to include in the commit
    git add file1 file2
    
  8. Create a new branch for your contribution:
    git checkout -b your-branch-name
    
  9. Begin migrating components and features to React.js and Next.js, adhering to best practices and code conventions.
  10. Start Development Server: To test your changes locally to ensure they function correctly.
    npm run dev
    
  11. Commit: your changes with descriptive commit messages:
    git commit -m "Commit message"
    
  12. Push: your changes to your forked repository:
    git push origin your-branch-name
    
  13. Open a PR: to the main branch of this repository.

Once your pull request is submitted, it will be reviewed by the project maintainers. Feedback and suggestions for further improvements may be provided. Thank you for contributing to the migration of Rentalog's tech stack to React.js and Next.js!

πŸ”— Inspiration Links

  • Figma Design: Explore the Figma design for the new version of Rentalog here.

  • Current Tech Stack: To explore the current tech stack used in the older version of Rentalog, visit Rentalog.in. Use its functionality as a reference while migrating to React.js and Next.js.

  • Rentalog Demo Account Credentials:

  • Username: [email protected]

  • Password: @1a2b3c4d5E

πŸ“„ License

Rentalog is released under the MIT License. By contributing to this project, you agree to provide your contributions under the same license.

✨ Contributors

All Thanks to our contributors πŸ’™

GitHub Contributors

Feel free to join our team and contribute to making Rentalog even better! πŸš€

rentalog-rent-management-web-app-for-landlords's People

Contributors

acesif avatar anujrathour avatar daveless avatar deoruchi avatar faid0 avatar gauravsingh1281 avatar iamdivyak avatar jeet1703 avatar jinaybarot avatar karandeep4423 avatar kashif-saleem-ghuman avatar kcsaiganesh avatar krish-panchani avatar manish-bhukar avatar nakel-ola avatar pabitra-kumar avatar pcoder23 avatar pratikshelar546 avatar roy404dev avatar saisantosh2209 avatar sheshant-manure avatar suman-jyoti-phukan avatar sumankisku avatar suyashrajput avatar vashukashyap avatar weberankit avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

rentalog-rent-management-web-app-for-landlords's Issues

Would it be possible to begin designing the backend API and data model for this application?

Discussed in #68

Originally posted by kcsaiganesh October 16, 2023
@gauravsingh1281 I am proposing that we start designing the backend API and data model for this application. This is an important step in the development process, and it will help us to ensure that the application is well-designed
I would prefer to suggestions on as follows:

  • Security on Authentications, Authurization for api requets, user based access controll(jwt/middlwares).
  • api design/ firebase as SaaS.
  • credentials managment

docs: update README.md

Brief description of issue

  • The current README.md file indicates that the stack for this web app contains Bootstrap though it uses Tailwind CSS.

Resolution:

  • Update README.md to display Tailwind CSS instead of Bootstrap.

Warnings in login and home page!

warnings
warnings2

Minor changes are required to be made. Along with this issue, I am also submitting a PR with a resolution to it.
The gap between Right Hand Side form's first name and last name is too much.
inputgap
So, more appealing gap would be like this -
gapfix
Also, the social icons don't have added links in the Contact Us component whereas it is there in the footer.

Deceptive Site Warning on rentalog-web-app.azurewebsites.net

I am receiving a "Deceptive site ahead" warning when attempting to access the website at "rentalog-web-app.azurewebsites.net." The warning states that attackers may attempt to trick users into installing software or revealing personal information. This warning has raised concerns about the safety and security of the website.

screenshot

Hacktoberfest

Rebuilding AboutUs Section

I want to add following feature to the section:

  1. An vector image as logo
  2. Styling of content in about section

Which page or section the user is currently on when they click on a navigation link

I want to enhance the user experience by making it clear which page or section the user is currently on when they click on a navigation link.

how I am going to do that ??
since this project uses react-router-dom I am going to use Use-current location to find URL text and on that basis, I will change the background color of that nav link

could you assign me this task under the Hactoberfest tag?

Copyright issue

In copyright year is fix '2023' I want to make it dynamic so it changes according to year changing. So please assign me under hactoberfest.

αΈ€over effect on buttons

I noticed there is no hover effect on buttons on home page , would you like me to work on it under hacktoberfest ?

[Fix] Get Started button is not linked

Describe issue.

Get started button in the header section is not linked.

Expected behaviour.

when user click on the get started. he should navigate to the registration page.

Restructuring the Contact Section

For Contact section,
Informal Content:
The content in the contact section lacks a formal tone and language, which may not align with the professional image the website intends to project.

Fields and Text Alignment:
Fields and accompanying text are not displayed side by side as is typical on formal websites. This can make the contact form appear disorganized and use

Screenshot 2023-10-24 092538

About us change

We can put all stuff on the About Us page in the About Us link rather than at home so to fix this issue, assign me this.

Hover effect causing unintended padding causing unwanted layout shift

Title

Hover effect causing unintended padding increase in navbar elements

Issue Type

  • Bug

Description

Bug Description

When hovering over the navbar elements, such as the "HOME" link, the padding is increasing, pushing other elements on the page. This behavior is not expected and causes a layout issue.

Steps to Reproduce

  1. Go to the website.
  2. Hover over the navigation elements in the navbar.

Expected Behavior

The hover effect should be applied without increasing the padding or affecting the layout of other elements.

Actual Behavior

The padding increases when hovering over the navbar elements, pushing other content down.

Screenshots/Additional Information

I have mark the element with an arrow, You can recreate the issue hovering there
Screenshot (736)

Environment

  • Browser: [ Chrome]
  • Operating System: [ Windows 11]

Additional

  • You can assign me this under the hactoberfest

Navbar UI needs a little improvement

In reference to issue #81, little changes can be made to the navbar's UI because there are some issues with it:

  • Hovering over the text creates a box around it (visible when a shadow appears).
  • Additionally, the login and registration buttons have no effects on them.

image

Navbar UI in smaller devices can be improved

image

Expected Behaviour

Every element in the navbar has been given consistent effects.

[Fix] : improper behaviour of Navbar Menu

Describe issue

Navbar menu is not working properly it is sticking to top only.

Expected behaviour

Navbar menu should not with scroll with page and cover the whole screen.

Steps to reproduce

  • open website on mobile
  • click on menu icon in navbar ( menu will openup )
  • scroll the screen ( navbar will scroll with screen )

Additional Info

Screencast.from.2023-10-18.17-17-45.webm

Improving ui in the page

I would like to change the navbar animation and redesign the login / signup button and also improve the transition in the whole page please assign me this issue

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.