Hi, I'm [YOUR_NAME], a Frontend Engineer at [COMPANY_NAME]. I'm excited to discuss your experience and skills today.
•
Could you briefly introduce yourself and share what interests you most about frontend development?
•
Great, thank you for sharing! In the next 50 minutes, we'll work through a coding challenge focusing on frontend technologies. After that, you can ask any questions you have about the role or the company.
Coding Challenge
45 min
•
Build a Responsive Image Gallery with JavaScript
Design and implement a responsive image gallery that displays a grid of images. When an image is clicked, it should open a modal window displaying the image in a larger view along with its caption. The gallery should adjust the number of columns based on the screen size.
Requirements:
Use HTML, CSS, and vanilla JavaScript (no libraries or frameworks).
Implement responsive design:
For screens wider than 600px, display images in a grid of 3 columns.
For screens 600px or narrower, display images in a single column.
Clicking on an image opens a modal overlay with the larger image and caption.
The modal can be closed by clicking a close button or clicking outside the modal.
Follow-Up Questions:
How would you improve the performance of your gallery for a large number of images?
How can you make your gallery accessible to users with disabilities?
What considerations are there for cross-browser compatibility?
•
If you had more time, what features or improvements would you add to your gallery?
•
Great job on the coding challenge!
Closing
10 min
•
Do you have any questions for me about the role or the company?
•
Thank you for your time today. We'll be in touch soon regarding the next steps.
Hi, I'm [YOUR_NAME], a Frontend Engineer at [COMPANY_NAME]. I'm excited to discuss your experience and skills today.
•
Could you briefly introduce yourself and share what interests you most about frontend development?
•
Great, thank you for sharing! In the next 50 minutes, we'll work through a coding challenge focusing on frontend technologies. After that, you can ask any questions you have about the role or the company.
Coding Challenge
45 min
•
Build a Responsive Image Gallery with JavaScript
Design and implement a responsive image gallery that displays a grid of images. When an image is clicked, it should open a modal window displaying the image in a larger view along with its caption. The gallery should adjust the number of columns based on the screen size.
Requirements:
Use HTML, CSS, and vanilla JavaScript (no libraries or frameworks).
Implement responsive design:
For screens wider than 600px, display images in a grid of 3 columns.
For screens 600px or narrower, display images in a single column.
Clicking on an image opens a modal overlay with the larger image and caption.
The modal can be closed by clicking a close button or clicking outside the modal.
Follow-Up Questions:
How would you improve the performance of your gallery for a large number of images?
How can you make your gallery accessible to users with disabilities?
What considerations are there for cross-browser compatibility?
•
If you had more time, what features or improvements would you add to your gallery?
•
Great job on the coding challenge!
Closing
10 min
•
Do you have any questions for me about the role or the company?
•
Thank you for your time today. We'll be in touch soon regarding the next steps.