Hi, I'm Natalia!

My experience

• 

  Pokemons describer

  • React
  • Reduxt
  • TypeScript
  • Possibility to change items amount per page
  • Pagination
  • DOM-events;
  • API
  Show github

• 

  Virtual keyboard

  • Dynamic rendering (ctrl+alt changes language, shift adds special symbols);
  • DOM-events;
  • Syncronization real and virtual keyboard
  • Css-animation effects;
  Show github Show deploy

• 

  Minesweeper

  • Dynamic rendering;
  • DOM-events;
  • Eslint;
  • Light/Dark theme;
  • Adaptive (tablet, mobile), liquid and semantic layout;
  Show github Show deploy

• 

  CSS-selector simulator

  • TypeScript;
  • Modules;
  • Webpack;
  • OOP;
  • Adaptive (tablet, mobile), liquid and semantic layout;
  Show github Show deploy

• 

  Landing for animal's shelter

  • Popup for animal's cards;
  • Neverending slider;
  • Pagination;
  • Mobile burger-menu;
  • Adaptive (tablet, mobile), liquid and semantic layout;
  Show github Show deploy

• 

  Landing for gardening care

  • Mobile burger-menu;
  • Custon select in Contact section;
  • Focus canging according button's click in Service section;
  • Accordion in Price section;
  • Adaptive (tablet, mobile) and liquid layout;
  Show github Show deploy

• 

  Block, which can help to find github repo, includes entered substring

  • Is's using GitHub REST API;
  • If you input uncorrect - create "mistake"-massage
  • Have got a validation
  • Enter your keyword into input;
  • Get results!
  • Search starts by click on the search-button and by press "Enter";
  Show github Show deploy

• 

  Landing "Elite Fire" (fireplace for home)

  • gulp build system;
  • svg-sprite (by gulp);
  • custom input-range, adio-buttons, checkboxes;
  • multiple backgrounds;
  • custom fonts;
  • adaptive and liquid layout;
  • flex, SCSS;
  • semantic HTML;
  Show github Show deploy

• 

  Section for adding comments and edit comment's list.

  • To write your own comment: enter your name into name-input;
  • enter text into text-area;
  • choose date or skip it (if you skip date will be written automatically)
  • click on the submit-batton or press "Enter";
  • To edit comment's list: click on heart-icon for add/remove like
  • fclick on bit-icon for delete any comment.
  Show github Show deploy

• 

  Test task

  • Change tabs on click;
  • gulp + webpack;
  • flex, grid, position;
  • SCSS
  • desktop and mobile layouts (and liquid between them);
  • It have got input validation and possibility add more then one input.
  Show github

• 

  SPA with film collection

  • REST API;
  • progressive loading;
  • "shake effect" for interactive components when the server doesn't respond;
  • adding and deleting comments;
  • you can filter and sort movies and create your own rating;
  • Moreover a fixed the academy's code.
  Show github Show deploy

• 

  Test task

  • adaptive layout (mobile first, desktop);
  • liquid layout (flex, position);
  • if there are too much time-slots and a lack of place in the string, additing slots are hid, the more-button is appears and shows additing slots on click;
  Show github Show deploy

• 

  My portfolio page

  • creating elements by JS;
  • page animation by js;
  • background animation by css;
  • modal windows;
  • liquid layout (flex, grid);
  Show github Show deploy

• 

  Pet-project. Free figma layout, just with desctop version.

  • adaptive layout (from mobile to desktop);
  • liquid layout (flex, grid, position);
  • scroll animation;
  • neverending slider (feedback);
  • usual slider (examples);
  • burger-menu for small screens.
  Show github Show deploy

• 

  Test-task. Liquid & adaptive layout.

  • flex, grid;
  • @keyframes animation;
  • video-background, gradients;
  • burger-menu for small screens;
  • countdown timer;
  • neverending slider.
  Show github Show deploy

• 

  Pet-project. Just descktop version.

  • flex, position;
  • modal window;
  • neverending slider.
  Show github Show deploy

• 

  Pet-project. Social-media page, adaptive layout.

  • grid, position;
  • custom checkbox;
  • css slider;
  • form validation;
  • interactive elements.
  Show github

• 

  Project from learning, just descktop version.

  • flex, position, bootstrap;
  • service's tabs switching (plugin, JS);
  • modal window for order;
  • photo's carousel (@fancybox, JS);
  • REST API.
  Show github Show deploy

• 

  Project from learning, just descktop version.

  • interaction with the server;
  • CRUD-operations;
  • choosing a service, date, and master;
  • form for adding, deleting, and updating orders.
  Show github