chevron-left chevron-right

Piotr Nalepa Frontend, architektura i AI

Daj Się Poznać 2017 – raport z działań. Część 5

Ta wersja
blog.piotrnalepa.pl/2017/04/02/daj-sie-poznac-2017-raport-z-dzialan-czesc-5
Opublikowano
Autor
, Staff Software Engineer
Kategorie
DSP2017, JavaScript
Uwagi
Napisz do mnie · Napisz na X

Ten wpis ma 9 lat. Od tego czasu przeglądarki i narzędzia mogły się zmienić, więc zanim użyjesz kodu, sprawdź go z aktualną dokumentacją.

Kolejny tydzień pracy nad projektem League Manager za mną. Przez ten czas udało mi się rozwiązać jeden dość palący problem, o czym więcej w dalszej części wpisu.

Sekcja 1Co się udało zrobić?

W kwestii funkcjonalnej przełom nie nastąpił. Zacząłem implementację formularza tworzenia nowego zawodnika i napotkałem problem związany z aktualizacją meta danych dla custom post type'u zawodnika. Na szczęscie niedawno udało się znaleźć rozwiązanie. Trochę nieoczekiwane, ale skuteczne. Zostanie to omówione w jednym z kolejnych wpisów.

Kolejnym problemem było zdobycie listy krajów wraz z kodami 2-literowym i 3-literowymi. Być może źle szukałęm, ale nie spotkałem nigdzie takowej listy w formacie JSON, dlatego postanowiłem sobie wygenerować taką listę za pomocą małego skryptu.

Będąc na stronie z listą kodów państw otworzyłem konsolę narzędzi webmasterskich, a następnie wykonałem poniższy skrypt:

Przykład 1JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
let countries = [...document.querySelectorAll('#codelist .border1')].map(row => {
    if (!row) {
        return;
    }
 
    let cells = [...row.querySelectorAll('td')];
 
    if (!cells.length) {
        return;
    }
 
    let name = cells[1].querySelector('a');
 
   if (!name) {
       return;
   }
 
   return {
       name: name.innerHTML,
       let2: cells[2].innerHTML,
       let3: cells[3].innerHTML,
   } 
}).filter(item => item);
 
console.log(JSON.stringify(countries));

To zaowocowało wygenerowaniem tablicy z kodami dla 205 państw. Końcowy rezultat, a jednocześnie listę w formacie JSON można pobrać z gista.

Sekcja 2Plan na nadchodzący tydzień

Celem będzie dokończenie formularza dodawania zawodnika oraz zbudowanie interfejsu tworzenia składu dla wybranego zespołu w wybranym sezonie. Idealnie byłoby zacząć pracę nad wyglądem interfejsu, bo ten póki co jest ascetyczny.

Rzeczą do rozważenia pozostaje albo implementacja automatu do tworzenia formularzy na podstawie dostarczonej konfiguracji, bądź znalezienie jakiegoś już istniejącego rozwiązania napisanego w ReactJS. Może znasz jakieś, które możesz polecić?

Sekcja 3Podsumowanie

Patrząc na to, co do tej pory zrobiłem raczej ciężko mówić o jakimś piorunującym tempie prac nad projektem. Niemniej jednak, ja jestem zadowolony, a to z kilku powodów. Udaje mi się kontynuować pisanie 2 postów tygodniowo. Dodatkowo, znajduję jednak czas do pracy nad projektem który zawsze chciałem zrealizować. To czy się go uda ukończyć przed końcem maja, to jest kwestia mniej istotna dla mnie. Wpisy dotyczące projektu będą się pojawiały nawet po zakończeniu akcji Daj Się Poznać 2017.

Poniżej znajdziesz listę linków do których warto zajrzeć:

Udostępnij
Uwagi

O autorze

Staff Software Engineer

Piszę na tym blogu od 2009 roku, a strony i aplikacje webowe tworzę zawodowo od 14 lat. Obecnie w Bishop Fox prowadzę frontend platformy Cosmos, od samego początku projektu. Wcześniej pracowałem m.in. w OLX, KUDO, Auto1 i eZ Systems. Piszę tu o tym, czego nauczyłem się w praktyce: o JavaScripcie, TypeScripcie, Reakcie, CSS-ie i architekturze frontendu. Występowałem też jako prelegent na konferencjach w Polsce i Europie. Masz pytanie albo pomysł na wpis? Daj znać!