- Part of the Practicum by Yandex Web Development Bootcamp Curriculum.
- Description of the project and its functionality
- Features
- Technologies
- Figma
- Images
- Demo
Description of the project and its functionality
A responsive website using HTML5, CSS3 (flexbox, grid, BEM), built following to design mokup in Figma. JavaScript is used to add functionality to Form Fields in a Popup Box and save the edited values. Used BEM methodology with a nested file structure. The project adapts to the width of various devices (from 320px to 1280px). The project is based on dynamically editing the profile information on popup modals and adding cards of places and image popups. Everything is rendering responsively adapting to different screen sizes.
Features
- Form Popup Modal: editing profile information, adding/deleting cards with images and titles unsing a link to photo and Forms are validated using javascript. Image popup for each card with Delete and Like button.
Technologies
Stack: HTML5, CSS3, flexbox, grid layout, BEM, Media queries, transition, JavaScript, DOM, Debugging Git, Figma, Form validation, OOP, Webpack
Figma
The website was made up according to the Figma layout requirements:
Images
Export images directly from Figma and optimize them here, so your project loads faster.