• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

codereview react redux js opinia

VPS Starter Arubacloud
0 głosów
182 wizyt
pytanie zadane 26 lipca 2020 w JavaScript przez rob Bywalec (2,440 p.)
edycja 26 lipca 2020 przez rob

Proszę o code review, dopiero zacząłem pisać ale jestem ciekawy czy podążam we właściwym kierunku, co robię źle, co można poprawić? Chodzi mi o funkcjonalność react, redux,js nie skupiałem się bardzo na css to będzie do poprawy, i jeszcze jedno apka inaczej wyświetla się na githubie a inaczej na localhost, na githabie jest wyraźnie większa - pracuję nad tym, ale ktoś wie dlaczego?

live

https://robkot500.github.io/to_do/

code

https://github.com/robkot500/to_do

proszę o pomoc

komentarz 26 lipca 2020 przez ScriptyChris Mędrzec (190,190 p.)
Z tego co widzę w podlinkowanym repo, to znajdują się tam zbundlowane pliki - a takie raczej nie nadają się do (komfortowego) czytania przez ludzi. Więc jakbyś mógł, to dorzuć oryginalne pliki źródłowe (przed procesem bundlowania i minifikacji).
1
komentarz 26 lipca 2020 przez rob Bywalec (2,440 p.)

1 odpowiedź

0 głosów
odpowiedź 26 lipca 2020 przez Aisekai Nałogowiec (42,190 p.)
wybrane 26 lipca 2020 przez rob
 
Najlepsza
Mały projekt ale zawsze coś do poprawy:

1. Zbędne console.log

2. Zbędny zakomentowany kod

3. React udostępnia możliwość tworzenia styli i "modulowania" ich - unikanie konfliktów css między komponentami https://create-react-app.dev/docs/adding-a-css-modules-stylesheet/

4.  W Add.js - if do wywalenia, do zastąpienia switchem.

5. Tak samo w Header.js

6. Stylowanie za pomocą 'px', stylowanie po elemencie zamiast klasie.

7. Zbyt płaska struktura projektu.

8. Akcje bezsensownie nazwane np Akcja: "DELETE"  - zbyt ogólnie, za mało specyficzne. Zmieniłbym to na coś: "[TASKS] DELETE". Nazwy akcji bym wydzielił do jakiegoś enuma. Zastosowałbym pattern Action Creator.

9. Jak poznasz routing - do zastąpienia mechanizm zmiany widoku (w sensie zastosowanie routingu).
komentarz 26 lipca 2020 przez imklau Nałogowiec (42,090 p.)
6. Ja tam widzę dużo stylowania za pomocą % a nie px
7. Wypadałoby wytłumaczyć, w czym problem z "płaską strukturą kodu"
komentarz 26 lipca 2020 przez Aisekai Nałogowiec (42,190 p.)
7) Na temat struktury projektów, jest mnóstwo artykułów łatwo dostępnych w internecie - wystarczy wpisać frazę w Google "React Project Structure".

Pierwszy wynik:

https://medium.com/@Charles_Stover/optimal-file-structure-for-react-applications-f3e35ad0a145
komentarz 26 lipca 2020 przez rob Bywalec (2,440 p.)
edycja 26 lipca 2020 przez rob

 dziękuję za review i inne wypowiedzi

@Aisekai, można dwa zdania przybliżenia odnośnie tej płaskiej struktury? tak własnymi słowami?

nie rozumię też

9. Jak poznasz routing - do zastąpienia mechanizm zmiany widoku (w sensie zastosowanie routingu).

komentarz 26 lipca 2020 przez rob Bywalec (2,440 p.)

@Noemi, mam link do arta ale  czy można w dwóch zdaniach wytłumaczyć o co chodzi ze strukturą projektu? dzieki za wypowiedź

1
komentarz 26 lipca 2020 przez Aisekai Nałogowiec (42,190 p.)

Odnośnie płaskiej struktury:

Masz wszystkie komponenty wrzucone do jednego folderu. To powoduje dwa dość poważne problemy:

1) przyrostowa ilość plików w folderze - jeżeli będziesz miał 100 komponentów, to nagle zrobi Ci się 100 plików w jednym folderze. Nie mówiąc już o klasach odpowiedzialnych za jakąś logikę aplikacji

2) Brak jakiejkolwiek hierarchii. Jeżeli masz np komponenty wykorzystywane do zarządzania Taskami - wrzuciłbym je do folderu np. tasks. Jeżeli masz komponenty wykorzystywane do zarządzania postami - wrzuciłbym je do folderu posts. Gdybym miał komponent wykorzystywany tu i tu - wrzuciłbym do shared. Łatwiej będzie zlokalizować jakąś konkretną klasę/komponent

Odnośnie routingu - wykorzystujesz teraz coś takiego do wyświetlania różnych "podstron":

props.position.position

W routingu wykorzystujesz Link / NavLink (nie pamiętam już). Dalej będziesz miał SPA ale będziesz miał w pewnym sensie "udawany" routing (nie będą ładowane inne pliki html, tylko React-Router zajmie się podmianą pewnych wyświetlanych komponentów).

komentarz 27 lipca 2020 przez rob Bywalec (2,440 p.)
dzięki

Podobne pytania

+1 głos
1 odpowiedź 144 wizyt
pytanie zadane 20 lipca 2020 w JavaScript przez rob Bywalec (2,440 p.)
0 głosów
1 odpowiedź 160 wizyt
pytanie zadane 24 lutego 2021 w JavaScript przez malvator Użytkownik (720 p.)
0 głosów
1 odpowiedź 244 wizyt
pytanie zadane 2 czerwca 2023 w JavaScript przez DzikieHarce Użytkownik (690 p.)

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...