---
title: OLA Aleko
tags: OLA, Aleko-Projects
description: View the slide with "Slide Mode".
---
# შედეგები:
| პროექტი | ხარვეზი | სტატუსი |
| ------------------------ |:-------:|:------------------:|
| TODO-[Classes] | 0 | :heavy_check_mark: |
| TODO-[Hooks] | 0 | :heavy_check_mark: |
| Pop-up-[Outside Click] | 0 | :heavy_check_mark: |
| Context-menu | 0 | :heavy_check_mark: |
| Imitated-twiter-[GroupPr]| - | :timer_clock: |
| Portfolio | 1 | :heavy_check_mark: |
| - | - | - |
# Project 1 (Todo):
პროექტის პირობა: [Meeting-10/homework](https://github.com/DanielBarbakadze/Advanced-JS-and-React-Basics/tree/master/Meeting-10/homework)
შესრულებული დავალება: [ol-academy-react-todo](https://github.com/AllmaG3st/OL_Todo-List)
---
## რჩევები :bulb:
1. ფაილების დასახელება [/components](https://github.com/AllmaG3st/OL_Todo-List/tree/main/src/components) ფოლდერის შიგნით უფრო მიღებულია დაწერო `PascalCase` ით.
2. ეცადე კომენტარები გამოიყენე მხოლოდ utility ფუნქციების ან ბიზნეს ლოგიკის შემთხვევაში. ყოველთვის როცა გაიფიქრებ რომ კომენტარი დაწერო, დაფიქრდი თუ არის შესაძლებელი კოდის ისეთნაირად გადაკეთება რომ თავად აღწეროს საკუთარი ფუნქციონალი.
3. გთხოვ გამოიყენო [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) რომელიც დაგილაგებს კოდს და შენც მიეჩვევი მუდმივად ერთნაირად წერას. თუ რამე არ მოგეწონება კონფიგურირებაც შესაძლებელია
4. `// ! Es ratom ar mushaobs?` ეს ნაწილი გავტესტე და ჩემთან მუშაობს :man-shrugging:
5.
```jsx
// ამის ნაცვლად შეგიძლია დაწერო
!el.completed
? styles.li__container
: styles.li__container__completed
// ასე:
el.completed
? styles.li__container__completed
: styles.li__container
// ვფიქრობ მეტად აღქმადია
```
6. შეგიძლია დესტრუქტურიზაცია გაუკეთო `this.props` და თავიდან აიცილო მისი მრავალჯერადად დაწერა, მაგალითად:
```jsx
// აუცილებლად render() მეთოდის შიგნით, return-მდე.
const {
todos,
handleChecked,
markCompleted,
editTodo,
changeEditMode,
moveTodo,
deleteTodo,
deleteAll,
deleteChecked
} = this.props;
/*
* ამის შემდეგ შეძლებ გამოიყენო როგორც:
* todo.map(), handleChecked()...
* და არა this.props.todo.map(), this.props.handleChecked()...
*/
// პ.ს იგივე შეიძლება this.state ის შემთხვევაშიც, თუ ამის საჭიროება იქნება
```
7. უმჯობესი იქნება [`scss`](https://sass-lang.com/) ის გამოყენება, `css` ის ნაცვლად
8. მე შენს ადგილზე `/common` ფოლდერს ან `/components` ში შევინახავდი ან ცალკე `/utils` ად გავიტანდი
---
## შეფასება
:heavy_check_mark: წაშლა / დამატების ფუნქციონალი
:heavy_check_mark: მონიშნულების / დასრულებულების წაშლა
:heavy_check_mark: რედაქტირება
:heavy_check_mark: გადაადგილება
:heavy_check_mark: ერორების მართვა
ყველა პირობა შესრულებულია :100: :heavy_check_mark:
---
## შეჯამება :muscle: :tada:
ერთიანობაში საკმაოდ კარგი დავალებაა და აკმაყოფილებს ყველა კრიტერიუმს :+1:
---
# Project 2 (Pop-up):
პროექტის პირობა: [Meeting-13/homework-1](https://github.com/DanielBarbakadze/Advanced-JS-and-React-Basics/tree/master/Meeting-13/homework#homework-1-popup--handleoutsideclick)
შესრულებული დავალება: [ol-academy-popup-with-handling-outside-click](https://github.com/AllmaG3st/ol-academy-popup-with-handling-outside-click)
---
## შეფასება
ყველა პირობა შესრულებულია :100: :heavy_check_mark:
---
# Project 3 (Context-menu):
პროექტის პირობა: [Meeting-13/homework-2](https://github.com/DanielBarbakadze/Advanced-JS-and-React-Basics/tree/master/Meeting-13/homework#homework-2-context-menu)
შესრულებული დავალება: [ol-academy-context-menu](https://github.com/AllmaG3st/ol-academy-context-menu)
---
## რჩევები :bulb:
1. `import Container from "./components/Container/Container";` ორჯერ რომ არ მოგიწიოს კომპონენტის ფოლდერის და სახელის დაწერა შეგიძლია ამ ფოლდერში დაამატო `index.js` ფაილი:
```js
import Container from "./Container"
export default Container
// ... in other file import it like
import Container from "./components/Container"
```
პ.ს შეგიძლია ეს 3 ფოლდერი 1 ფოლდერში გააერთიანო, არ არის ამდენად განსხვავებული იდეურად :man-shrugging:
---
## შეფასება
ყველა პირობა შესრულებულია :100: :heavy_check_mark:
---
---
# Project 4 (Portfolio):
პროექტის პირობა: [Meeting-15/homework](https://github.com/DanielBarbakadze/Advanced-JS-and-React-Basics/tree/master/Meeting-15)
შესრულებული დავალება: [ol-academy-portfolio](https://github.com/AllmaG3st/ola-portfolio)
---
## რჩევები :bulb:
1. დიზაინი დახვეწე და კონტენტი განაახლე
---
## შეფასება
ყველა პირობა შესრულებულია :100: :heavy_check_mark: