Loading repository data…
NarendraKoya999 / repository
This Repository contains List of Frontend Development Interview Questions
Build a Basic HTML Page: Create a basic HTML page that includes a header, navigation menu, main content section, and a footer.
Responsive Navigation Menu: Implement a responsive navigation menu that collapses into a hamburger menu on smaller screens using HTML, CSS, and JavaScript/jQuery.
JavaScript Calculator: Build a simple calculator using HTML, CSS, and JavaScript that can perform basic arithmetic operations (addition, subtraction, multiplication, division).
Image Carousel: Create an image carousel/slider using HTML, CSS, and JavaScript/jQuery that allows users to navigate through a set of images with next and previous buttons.
To-Do List Application: Develop a to-do list web application using HTML, CSS, and JavaScript. Users should be able to add, edit, and delete tasks.
Responsive Design: Take an existing web page and make it responsive for various screen sizes (e.g., desktop, tablet, mobile) using media queries and CSS.
Fetch API: Use the Fetch API to retrieve data from a JSON endpoint and display it on a web page using JavaScript.
Single Page Application (SPA): Build a simple single-page application (SPA) using a frontend framework of your choice (e.g., React, Angular, Vue.js). Create multiple views and navigate between them.
Form Validation: Implement client-side form validation for a registration form using HTML5 and JavaScript. Validate fields like email, password strength, and required fields.
Implement a Drag and Drop Feature: Create a web page with a drag-and-drop interface using HTML, CSS, and JavaScript. Allow users to drag elements and drop them into designated areas.
Infinite Scroll: Implement an infinite scroll feature on a web page. Load additional content as the user scrolls down the page using JavaScript and AJAX.
Interactive Map: Build an interactive map using a mapping library (e.g., Leaflet, Google Maps API) and allow users to search for locations, add markers, and display additional information when clicking on markers.
Web Accessibility: Ensure that a web page complies with web accessibility standards (WCAG). Make necessary HTML and CSS modifications to improve accessibility for users with disabilities.
CSS Animation: Create a CSS animation, such as a spinning loader or a fading effect, to enhance user experience on a webpage.
Responsive Email Template: Design and code a responsive email template that looks good on both desktop and mobile email clients.
Dynamic Content Filtering: Create a web page that allows users to filter content dynamically based on categories or tags using JavaScript.
Social Media Sharing Buttons: Implement social media sharing buttons (e.g., Facebook, Twitter) on a webpage. When a user clicks a button, a share dialog should appear.
Image Lazy Loading: Implement image lazy loading to improve page performance. Images should only load when they are in the viewport.
Form Autocomplete: Add autocomplete functionality to a search input field using JavaScript. Provide suggestions as the user types.
Implement a Lightbox: Create a lightbox/modal window that displays images or content when a user clicks on a thumbnail or a button.
Real-time Chat Application: Build a real-time chat application using a frontend framework (e.g., React, Vue.js) and a backend technology like WebSocket or Firebase.
Responsive Tables: Make HTML tables responsive. Ensure that tables adapt to different screen sizes without horizontal scrolling.
Data Visualization: Create a data visualization chart (e.g., bar chart, pie chart) using a JavaScript library like D3.js or Chart.js.
Sticky Navigation: Implement a sticky navigation bar that sticks to the top of the page when scrolling down and returns to its original position when scrolling up.
Web Performance Optimization: Optimize the performance of a slow-loading webpage. Identify bottlenecks and apply optimizations to reduce load times.
Progressive Web App (PWA): Convert a web application into a Progressive Web App. Add features like offline access and push notifications.
Unit Testing: Write unit tests for a JavaScript function or component using a testing framework like Jest.
Cross-browser Compatibility: Ensure that a webpage works correctly and looks consistent across different web browsers (e.g., Chrome, Firefox, Edge).
Web Security: Identify and fix security vulnerabilities in a web application, such as Cross-Site Scripting (XSS) or Cross-Site Request Forgery (CSRF).
Responsive Email Signature: Design and code a responsive email signature that can be used in email clients.
Infinite Carousel: Create an infinite carousel/slider that automatically loops through a set of images or content, providing navigation controls for the user.
Image Gallery: Build an image gallery where users can view a collection of images, click to enlarge, and navigate through them using previous and next buttons.
Tooltip Component: Design and implement a reusable tooltip component in HTML, CSS, and JavaScript/jQuery that appears when hovering over specific elements.
Data Fetch and Display: Fetch data from a public API (e.g., GitHub API, OpenWeatherMap API) and display it on a webpage using JavaScript. Format and style the data appropriately.
Animated Dropdown Menu: Create a dropdown menu that expands and collapses with smooth animations when the user hovers over a trigger element.
Custom Web Animation Library: Create a small JavaScript library for animating elements on a webpage, including support for various easing functions.
Custom UI Components: Create custom UI components, such as a modal dialog, date picker, or autocomplete, from scratch using HTML, CSS, and JavaScript.
Mobile-First Development: Develop a webpage following the mobile-first approach, ensuring it looks and functions well on mobile devices and scales up to larger screens.
Third-Party API Integration: Integrate with a third-party API (e.g., Google Maps, Twitter, YouTube) and display data or content from that API on your webpage.
Offline Support: Implement offline support for a web application, allowing users to access content even when they have no internet connection.
Browser History API: Use the Browser History API to implement client-side routing in a single-page application (SPA).
Infinite Scroll with Pagination: Combine infinite scrolling with pagination to load and display content efficiently while allowing users to navigate through pages of data.
Web Audio Player: Build a web-based audio player with features like play, pause, volume control, and playlist support.
WebGL Experiment: Develop an interactive WebGL project, such as a 3D visualization or animation, and embed it into a webpage.
Lazy-Loaded Modules: Implement lazy-loading for modules in a frontend framework (e.g., React, Angular, Vue.js) to reduce the initial bundle size.
SVG Icon Library: Create a reusable SVG icon library with a search and usage feature for easy integration into web projects.
WebGL 3D Scene: Develop a 3D scene using WebGL, including 3D models, textures, and interactive elements.
Lazy-Loaded Images: Implement lazy-loaded images that load only when they come into the user's viewport, improving page loading performance.
Web Performance Monitoring: Implement web performance monitoring and analytics to track and analyze website performance over time.
Web Security Audit: Perform a security audit on a web application and identify vulnerabilities like SQL injection, XSS, and CSRF. Suggest and implement fixes.
Selected from shared topics, language and repository description—not editorial ratings.
AkhonzadaIrshad /
This is repository contains AngularJS(Basic to Advance), included all HTML, CSS(Bootstrap), JS(jQuery,AJAX,JSON) and much more.
maitray16 /
This repository contains a prototype of Airbnb implementing all the functionalities, analytics using MEAN Stack
sachinh2503 /
This repository contains projects of intensive web applications built using technologies like HTML5,CSS,AngularJS,jQuery,AJAX,JSON,PHP,AWS,Bootstrap,Google APIs,Yelp APIs. The repo will be constantly updated upon building new applications and/or modifications to the existing ones.
Interactive Forms: Enhance a web form with interactive features like auto-suggestions, input validation, and conditional form fields using JavaScript.
Page Transitions: Implement smooth page transitions between different sections or pages of a website using CSS transitions and JavaScript.
Keyboard Shortcuts: Add keyboard shortcuts to a web application to improve user accessibility and navigation.
Dark Mode Toggle: Create a dark mode toggle button that switches the website's color scheme between light and dark mode.
WebGL Experiment: Develop an interactive WebGL project, such as a 3D visualization or animation, and embed it into a webpage.
Custom Video Player: Build a custom HTML5 video player with custom controls, such as play, pause, volume, and progress bar.
Page Printing Styles: Define CSS styles for printing a web page so that it looks well-formatted when printed on paper.
Implement a Photo Gallery: Create a photo gallery with albums, thumbnails, and the ability to view images in a larger size.
Web Audio Player: Build a web-based audio player with features like play, pause, volume control, and playlist support.
SVG Animation: Animate SVG graphics using CSS or JavaScript to create eye-catching visual effects.
Custom CSS Framework: Develop a custom CSS framework with pre-designed components and styles for rapid front-end development.
Web Animation Framework: Create a JavaScript animation framework that simplifies the process of animating elements on a webpage.
Augmented Reality Web App: Develop an augmented reality (AR) web application that overlays digital content on the user's real-world view using WebXR or similar technology.
Progressive Image Loading Placeholder: Implement a progressive image loading technique that displays a blurred or low-quality image as a placeholder while the high-quality image loads.
Automated Web Testing: Write automated tests for a web application using testing frameworks like Selenium or Cypress.
Server-Side Rendering (SSR) with React: Set up server-side rendering (SSR) for a React application.
WebGL Shader Effects: Build a WebGL-based shader effect, such as a water ripple effect or a dynamic particle system.
Lazy-Loaded Images: Implement lazy-loaded images that load only when they come into the user's viewport, improving page loading performance.
Web Performance Monitoring: Implement web performance monitoring and analytics to track and analyze website performance over time.
Web Security Audit: Perform a security audit on a web application and identify vulnerabilities like SQL injection, XSS, and CSRF. Suggest and implement fixes.
Server-Side Rendering (SSR): Implement server-side rendering for a frontend framework (e.g., React, Angular) to improve initial page load performance.
WebGL Shader Effects: Build a WebGL-based shader effect, such as a water ripple effect or a dynamic particle system.
Virtual DOM Implementation: Implement a simplified virtual DOM (similar to React's virtual DOM) in JavaScript.
Progressive Image Loading: Develop an image loading technique that progressively loads images, starting with low-quality placeholders and improving to high-quality images.
Touch and Gesture Events: Implement touch and gesture events in a web application to provide touch-based interactions on mobile devices.
Browser Storage Management: Build a utility for managing browser storage (localStorage, sessionStorage) and provide methods for setting, getting, and removing data.
Web Worker: Use a web worker to offload computationally intensive tasks from the main thread, improving performance.
Custom UI Components: Create custom UI components, such as a modal dialog, date picker, or autocomplete, from scratch using HTML, CSS, and JavaScript/jQu