Skip to content

Bankist 2.0 is a minimalist and educational web application, showcasing essential web development concepts. This project, designed as the homepage for a bank website, serves as a practical learning resource. Explore features such as tabbed components, sticky navigation, menu fade animation, intersection observer API, lazy loading images, and more.

Notifications You must be signed in to change notification settings

amanverma-11/bankist-2.0

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Bankist 2.0 Web App

Welcome to Bankist 2.0, a learning project designed to explore and implement key web development concepts. This web app serves as the homepage for a bank website and incorporates various fundamental skills, making it an excellent resource for learning and practice.

image

Key Learning Objectives

Bankist 2.0 focuses on mastering the following web development concepts:

  1. DOM Events and Handlers:

    • Explore the Document Object Model (DOM) and understand how to handle events in response to user interactions.
  2. Event Propagation:

    • Gain insights into event propagation, understanding how events move through the DOM hierarchy.
  3. Event Delegation:

    • Learn the powerful technique of event delegation for handling events on multiple elements efficiently.
  4. Tabbed Component:

    • Build a tabbed component for organizing and displaying content, enhancing user experience.
  5. Sticky Navigation:

    • Implement a sticky navigation bar that remains fixed at the top as users scroll down the page.
  6. Menu Fade Animation:

    • Add visual appeal with a menu fade animation, creating a smooth transition effect.
  7. Intersection Observer API:

    • Leverage the Intersection Observer API to detect when elements come into view, optimizing performance.
  8. Lazy Loading Images:

    • Implement lazy loading for images to enhance page loading times and user experience.
  9. Slider Component:

    • Build a slider component for showcasing dynamic content with user-friendly navigation.

Getting Started

  1. Clone the Repository:
    git clone https://github.com/amanverma-11/bankist-2.0.git
    cd bankist-2.0

Usage

Explore Tabs:

Navigate through the tabbed components to access different sections of the web app.

Sticky Navigation:

Experience the convenience of a sticky navigation bar that stays visible as you scroll.

Menu Fade Animation:

Enjoy a subtle fade animation when interacting with the menu.

Intersection Observer API:

Observe elements dynamically entering the viewport, providing a seamless user experience.

Lazy Loading Images:

Witness optimized page loading with lazy-loaded images.

Slider Component:

Interact with the slider to browse through engaging content.

Bankist 2.0 is an educational project aimed at reinforcing your understanding of essential web development techniques. Dive in, explore the codebase, and enhance your skills in building interactive and dynamic web applications.

About

Bankist 2.0 is a minimalist and educational web application, showcasing essential web development concepts. This project, designed as the homepage for a bank website, serves as a practical learning resource. Explore features such as tabbed components, sticky navigation, menu fade animation, intersection observer API, lazy loading images, and more.

Topics

Resources

Stars

Watchers

Forks