PacifiCorp Demo is a web application project aimed at showcasing the services provided by Pacificorp, a renewable energy company. The project utilizes modern web technologies such as React, Tailwind CSS, and various icon libraries to create an interactive and visually appealing user interface.
- The application includes a comprehensive range of services offered by Pacificorp, including renewable energy solutions, clean transportation, grid innovation, and cloud data management.
- Interactive icons and visual elements are incorporated to enhance the user experience and provide a modern look and feel.
- React is used as the foundation for building the user interface, providing a component-based architecture for easy development and maintainability.
- Tailwind CSS, a utility-first CSS framework, is leveraged for efficient and responsive styling. It allows for the rapid creation of custom styles and ensures consistency across the application.
- Additional packages like DotLottie are utilized to introduce animations and dynamic elements into the user interface, creating an engaging and immersive experience.
- Clone the repository using the following command
git clone https://github.com/shahzada-shah/pacificorp-demo.git - Navigate to the project directory
cd renewable-services - Install the required dependencies
npm install - Start the development server
npm start
- Authentication page (sign in / sign out) connected by Firebase: Implement a secure authentication system using Firebase to allow users to sign in and sign out of the application. This will provide a personalized experience and enable access to user-specific features and data.
- User logged-in dashboard view: Create a dashboard view for authenticated users where they can access personalized information, manage their account settings, and perform specific actions related to their profile. This will enhance the user experience and provide a central hub for user-related activities.
- Navigation items made accessible using routes via React Router DOM and with their own layouts: Utilize React Router DOM to enable seamless navigation between different pages or sections of the application. Each navigation item will be associated with its own route, making it easy for users to access specific content.
- Customized Layouts: Customize the layouts of different pages to ensure a consistent and intuitive user interface. Each page will be designed to provide an optimal user experience, taking into account the specific content and functionality it offers.