The Bankist App is a simulated banking transaction application developed to showcase various JavaScript functionalities and techniques.
It allows users to log in, view their account balance, check their transaction history, transfer money to other accounts, request a loan, and close their account.
- Clone the repository and open the index.html file in your preferred web browser.
git clone https://github.com/your-username/bankist-app.git - Use the following credentials for logging in:
Username: 'ar', PIN: '1111' - Try out the features of the application and enjoy!
- User Authentication: Users can log in with their username and PIN.
- Account Overview: Display of current account balance and transaction history.
- Transaction History: View detailed transaction history with deposit and withdrawal information.
- Transfer Money: Transfer money to other accounts with real-time updates.
- Request Loan: Request a loan with automatic verification and processing.
- Close Account: Close the account with simple confirmation steps.
- Responsive Design: The application is designed to be fully responsive and works seamlessly across devices.
These are some of the key JavaScript concepts demonstrated in the Bankist app, showcasing my ongoing journey of understanding and implementing Javascript utilities.
- DOM Manipulation:
Interacting with the Document Object Model (DOM) to dynamically update the content and styling of HTML elements based on user actions or application logic. For example, updating our account balances, transaction history, and user interface elements like buttons and forms. - Event Handling:
Listening for user interactions such as clicks, form submissions, and keypresses. JavaScript event listeners are attached to HTML elements to trigger specific actions or functions when these events occur. For instance, logging in, transferring money, requesting a loan, and sorting transaction history. - Array Methods:
We've used array methods like forEach, filter, map, and reduce extensively to manipulate and iterate over arrays of account data. These methods allow for calculating account balances, summarizing transaction data, and filtering transactions based on specific criteria. - Date Manipulation:
The Date object is utilized to handle dates and times, particularly in formatting and displaying transaction dates. The Intl.DateTimeFormat object is used to format dates according to the user's locale, providing a customized experience based on regional preferences.
This project was done as part of Jonas Schmedtmann's JavaScript course on Udemy.*
*HTML file and CSS styling were provided and this app focuses on the Javascript portion.