View the site here
This is the next project on my journey to learn how to transform Figma designs into fully functioning websites, improve my CSS skills, and create modern and responsive React.js websites. I learn best by first studying the material and then doing a few projects to work out what I learned. I feel good with React.js and the BEM method so I added Vite and Tailwindcss to this project. I will have to Leave out The BEM method but I have been interested in learning Tailwindcss for quite some time. I'm also excited to work on more advanced placements of gradients and sections with business stats and testimonials.
- More practice with React functional components and their reusability
- More practice with React file and folder structure
- Using Tailwind CSS
- More practice with Fundamental CSS properties to master flex
- More practice with animations to gradients
- More practice with media queries for satisfactory responsiveness on all devices
This project was bootstrapped with React + Vite.
Components styled with Tailwindcss
Clone the project and enter its root directory.
Install Node.js -> Instructions
Installs all of the project's dependencies.
Runs the app in the development mode.
Open http://localhost:5173/bank_app/ to view it in your browser.
The page will reload when you make changes.
You may also see any lint errors in the console.
After finding the design I created a basic React + Vite app and set up the file structure. Next, I added some basic styles to my CSS file that I knew I would be resuing. After that, I built each section in the order they appear on the website, tweaking their responsiveness as I went. Lastly, I added features like a return-to-top button that wasn't in the original design.
This project is finished.