The project "React Desk with drag and drop" was created within two months. Themain function of the application is the task management in the form of cards. The project is an analogue of Trello. There was used a feature of drag and drop - dragging cards and cards columns on the board. To implement drag and drop, I used a library Sortable that works with React components. It involves the main data management functions - CRUD (create read update delete), which are wrapped in a Redux environment.

In the project I used:

- JavaScript - the main language of the project. I used Map object in reducers for quickaccess to any element and its children. I converted it to an array for immutable state andreturned it back to the Map object. Also I improved my knowledge of using Spread andRest operators in practice;

- React - JavaScript library for creating a user interface. I learned how to build astructure of the application from components, to create logic, used auxiliary hooks towork with state data;

- Redux Toolkit - used it to configure the storage and perform operations. It allows youto simplify and optimize the code too. I learned how to process the initial state and usethe functions of reducers;

- CSS3/SCSS - it is necessary to style the project. Used Flex to create flexible andcomplex blocks;

- BEM principal - is a methodology for writing styles;

- NPM - used for installation of React-Redux packages and additional requiredpackages;

- Git - control versioning system.

Source: https://github.com/flausdr/my-todo-list/

Live preview: https://flausdr.github.io/my-todo-list/

The project "Map and apartments" was finished after 3 months of work on it. The purpose of this application is a locator of accommodation for rent or sale/purchase. It visually consists of two parts: the map and the control sidebar. The control sidebar part contains all the basic data about the accommodation, which is available for the review. There are also filters for a quick and user-friendly search for apartments. Additionally, you can add new ads on the application by filling out forms and sending them to the server.

Owing to the connected real map you can see the location of the apartments. I created it using two versions: the first one - using Google Maps API, this documentation is not complicated, contains many methods and is easy to read; the second one - was created with Leaflet documentation. It has not only all the same methods as Google Maps Api, but also its own additional ones. This documentation gives a detailed description of the all steps and provides options for different visual maps. In the project I used:

- JavaScript - a language for implementing the main part of the project, namely for its logic. I learned to build logic correctly and use many methods, write my own synchronous/asynchronous functions, work with different types of data;

- Used Fetch to receive a request from the server. Worked with JSON data format in which manipulation occurs through queries and most often in building REST API;

- Used OOP (object-oriented programming) for the correct construction of the application architecture. Learned to build a hierarchy in the form of objects, each of which is an instance of a particular class, and the class, accordingly, creates an inheritance hierarchy;

- CSS3/SCSS - for styling HTML layout. I learned to use the basic properties of this language - Flex and Grid;

- BEM principal - methodology for writing styles. Learned to keep the order in styles;

- HTML5 - used to create the framework of the site;

- Webpack - used as a project compiler. Created my own configuration for the project;

- NPM - used to install the necessary packages for the project;- Used Git to control the versioning of the project. I can properly build a hierarchy of branches and work with them.

Source: https://github.com/flausdr/javascript-map/

Live preview: https://flausdr.github.io/javascript-map/