Project: Smartliving Property - Admin Portal
About the project
The project started from Sep/2021 and ended Dec/2022.
The project is included 2 main part. First is the mobile apps, which will be used by the tenants of Smartliving property as a tool to communicate between tenants and between tenants and the company. Second is the admin portal of the project, which is used to manage the contents, approve new users, create new team member...
I picked up the project from Sep/2022 to Dec/2022. My main objectives were to finish the rest of the website and refactor it.
First, I implement Redux for state management. Secondly, I used CSS module to scope CSS to local scope. Then, I added new Authentication and introduce new multilevel authentication for admins. Lastly, I transformed the code base from Javascript to Typescript for type safe and easier for other developer to pick up the development later on.
The project is included 2 main part. First is the mobile apps, which will be used by the tenants of Smartliving property as a tool to communicate between tenants and between tenants and the company. Second is the admin portal of the project, which is used to manage the contents, approve new users, create new team member...
I picked up the project from Sep/2022 to Dec/2022. My main objectives were to finish the rest of the website and refactor it.
First, I implement Redux for state management. Secondly, I used CSS module to scope CSS to local scope. Then, I added new Authentication and introduce new multilevel authentication for admins. Lastly, I transformed the code base from Javascript to Typescript for type safe and easier for other developer to pick up the development later on.
Technologies
React.jsRedux.jsFirebaseFigma
Project details
Desktop versionTablet version
View image
The tenant management page
This is the main page of this site where admin users could oversee and manage tenants.
This page is designed to be user-friendly, efficient, and easy to navigate, making it easy for admin users to view tenant data and perform various actions such as editing, approving, deactivating, and changing tenant email. With reactive design powered by React, this page is optimized for responsiveness and usability across a range of devices, ensuring that admin can manage their tenants on-the-go.
The tenant management page is essentially a table, displaying all of the relevant tenant information in a clear and organized manner. This information may include tenant names, email addresses, registration dates, account statuses, and more. From this table, admin users can quickly and easily perform a range of actions, such as approving new tenants, updating existing tenant information, or deactivating accounts if necessary.
Overall, the tenant management page is an essential component of any effective platform, providing you with the tools you need to manage your tenants efficiently and effectively.
This page is designed to be user-friendly, efficient, and easy to navigate, making it easy for admin users to view tenant data and perform various actions such as editing, approving, deactivating, and changing tenant email. With reactive design powered by React, this page is optimized for responsiveness and usability across a range of devices, ensuring that admin can manage their tenants on-the-go.
The tenant management page is essentially a table, displaying all of the relevant tenant information in a clear and organized manner. This information may include tenant names, email addresses, registration dates, account statuses, and more. From this table, admin users can quickly and easily perform a range of actions, such as approving new tenants, updating existing tenant information, or deactivating accounts if necessary.
Overall, the tenant management page is an essential component of any effective platform, providing you with the tools you need to manage your tenants efficiently and effectively.
Desktop versionTablet version
View image
Notice Page
Powered by Firebase functions and Expo push notifications, this feature ensures that tenants receive real-time updates and alerts directly on their mobile devices. The notice page is designed to be efficient, user-friendly, and highly effective, making it an essential tool for managing tenant communication and engagement.
At the core of the notice page is a table that displays all the notifications sent to tenants, providing you with a centralized hub for managing and tracking all communication. This table allows you to view details such as the notification message, the date and time it was sent, and whether the tenant has read the message yet. With this information readily available, you can quickly and easily track tenant engagement and ensure that important messages are being received. Overall, the notice page is an essential component of any successful platform, providing you with the tools you need to communicate with tenants effectively and efficiently, leading to increased tenant satisfaction and engagement.
At the core of the notice page is a table that displays all the notifications sent to tenants, providing you with a centralized hub for managing and tracking all communication. This table allows you to view details such as the notification message, the date and time it was sent, and whether the tenant has read the message yet. With this information readily available, you can quickly and easily track tenant engagement and ensure that important messages are being received. Overall, the notice page is an essential component of any successful platform, providing you with the tools you need to communicate with tenants effectively and efficiently, leading to increased tenant satisfaction and engagement.
Desktop versionTablet version
View image
The marketplace management page
In this project, we aimed to build a market place, where tenants could interact and sell their products.
In that essence, this page serves as a critical component for managing all the listings and ensuring that only safe and appropriate contents are being displayed to users. Built with a professional and intuitive design, the marketplace management page is designed to be user-friendly, efficient, and effective.
At the core of the marketplace management page is the ability to manage listings, allowing you to view and edit all the listings on your marketplace platform. With advanced search and filtering capabilities, you can quickly find and manage individual listings or groups of listings based on various criteria. Additionally, the marketplace management page allows you to exclude or censor dangerous listings or images that may be harmful or inappropriate for users. This ensures that your marketplace remains a safe and trustworthy platform for buyers and sellers alike.
Overall, the marketplace management page is a critical component of any successful online marketplace, providing you with the tools you need to manage your listings and ensure that your platform remains safe and secure for all users.
In that essence, this page serves as a critical component for managing all the listings and ensuring that only safe and appropriate contents are being displayed to users. Built with a professional and intuitive design, the marketplace management page is designed to be user-friendly, efficient, and effective.
At the core of the marketplace management page is the ability to manage listings, allowing you to view and edit all the listings on your marketplace platform. With advanced search and filtering capabilities, you can quickly find and manage individual listings or groups of listings based on various criteria. Additionally, the marketplace management page allows you to exclude or censor dangerous listings or images that may be harmful or inappropriate for users. This ensures that your marketplace remains a safe and trustworthy platform for buyers and sellers alike.
Overall, the marketplace management page is a critical component of any successful online marketplace, providing you with the tools you need to manage your listings and ensure that your platform remains safe and secure for all users.
Desktop versionTablet version
View image
Annoucement Pag
The announcement management page allows admin users to send announcements to all tenants who use the mobile application. It was developed using Firebase Functions and Expo push notification to ensure that users receive all notifications in a timely manner.
The page provides a simple and efficient way for the admin users to communicate important information to tenants, enhancing communication and promoting a positive tenant experience.
The page provides a simple and efficient way for the admin users to communicate important information to tenants, enhancing communication and promoting a positive tenant experience.
Desktop versionTablet version
View image
Newsfeed Page
Managing the newsfeed is essential for our social media platform, as it ensures that all content being shared on the platform is appropriate and aligns with our community standards. The newsfeed management page is designed to be efficient and user-friendly, allowing us to quickly and easily moderate all content shared on our platform.
With the newsfeed management page, we have the ability to flag any sensitive or inappropriate content, which allows us to identify and remove any posts that do not align with our guidelines. Additionally, the page enables us to review and approve posts that have been flagged for safety concerns, which ensures that all content on our platform is safe and appropriate for all users. By using this feature, we can maintain a positive and engaging environment for our users, promoting healthy interaction and engagement. Overall, the newsfeed management page is an essential tool for managing content on our social media platform, allowing us to promote a safe and positive environment for all our users.
With the newsfeed management page, we have the ability to flag any sensitive or inappropriate content, which allows us to identify and remove any posts that do not align with our guidelines. Additionally, the page enables us to review and approve posts that have been flagged for safety concerns, which ensures that all content on our platform is safe and appropriate for all users. By using this feature, we can maintain a positive and engaging environment for our users, promoting healthy interaction and engagement. Overall, the newsfeed management page is an essential tool for managing content on our social media platform, allowing us to promote a safe and positive environment for all our users.
LoginCreate new passwordEdit profileCreate new user (master admin)
View image