Blog

Nasi programiści pracują z różnych lokalizacji, ale najbardziej oddalone od biura w Warszawie jest rodzinne miasto Dawida. Na co dzień pracujący z Tczewa, Dawid Jancen od niemal 5 lat zajmuje się programowaniem frontendu i aplikacji SPA (single-page applications).

Zapytany o projekty open source i charytatywne zasługujące na wsparcie, wskazał te, które już kilkakrotnie otrzymały naszą darowiznę z jego inicjatywy. Tym sposobem Dawid 3. raz pomaga twórcom biblioteki jQuery, a po raz 4. „lokalsom” – Schronisku w Tczewie.

jQuery

Biblioteka JavaScript pomocna przy tworzeniu frontendu aplikacji webowych. Otwarte oprogramowanie z licencją MIT, obecnie rozwijane przez JS Foundation. Używane przez 73% z 10 milionów najbardziej popularnych serwisów internetowych, w tym: Wikipedię, Twittera czy LinkedIn. Przez nas wykorzystywane w wielu projektach, m.in. w systemie do sprzedaży i zarządzania usługami UK2.

Co daje nam biblioteka jQuery?

• Pluginy. Wiele bezpłatnych dodatków do wykorzystania w interfejsie, formularzach czy mechanizmach AJAX.
• Animacje. Gotowe do wdrożenia efekty zwiększające atrakcyjność interfejsu. Powód, dla którego biblioteka jQuery jest lubiana przez web designerów.
• Krótki kod. Zgodnie ze sloganem „Write less, do more”, jQuery potrafi wiele zdziałać za pomocą krótkich linijek kodu.
• Niezależność od przeglądarki. Biblioteka funkcjonuje we wszystkich najpopularniejszych przeglądarkach internetowych. Nie ma potrzeby dostosowywać kodu do każdej z nich.

„jQuery to pierwsza biblioteka, z której nauczyłem się korzystać, kiedy zacząłem przygodę z JavaScriptem. Istnieje od 13 lat i skupia wokół siebie aktywną społeczność, dzięki czemu łatwo znaleźć rozwiązania nawet najrzadszych problemów” – mówi Dawid.

Schronisko w Tczewie

Schronisko dla psów i kotów, od 2007 prowadzone przez OTOZ Animals. Organizuje adopcje, edukuje, otacza opieką swoich mieszkańców. W czerwcu na terenie schroniska otwarto Staruszkowo – miejsce dedykowane psim seniorom.

„Kilku moich znajomych było zaangażowanych w działalność tego schroniska. Stąd wiem, że schronisko w Tczewie stale potrzebuje datków na swoich podopiecznych” – uzasadnia nasz programista.

Ogólnopolskie Towarzystwo Ochrony Zwierząt OTOZ Animals zajmuje się nie tylko przygarnianiem zwierząt. Realizuje tysiące interwencji rocznie, prowadzi spotkania w szkołach, organizuje coroczne ogólnopolskie akcje zachęcające do adopcji i wspiera protesty, walcząc z okrucieństwem wobec zwierząt.

Od pierwszych zleceń na RentACoder za 15$ do 15-lecia firmy. Od freelancerki do spółki z o.o. Poprzez ciągłe uczenie się, wpadki, kolejne osiągnięcia, szczęśliwe zbiegi okoliczności.

W lipcu świętowaliśmy jubileusz. Wnioski? Zmieniali się ludzie i projekty, ale pewne wartości na stałe wpisały się w kod źródłowy Sidnetu.

1. Prowadzenie firmy to też praca zespołowa

Maksimum produktywności, minimum zbędnych procedur. Przez lata poznaliśmy i sprawdziliśmy na sobie różnorodne metody pracy, ale bezrefleksyjne trzymanie się ich nie jest w naszym stylu.

Z 20+ osobami na pokładzie zachowujemy płaską strukturę, w której każdy może mieć realny wpływ na organizację pracy, komunikację w zespole, dobór narzędzi. Nawet jeden głos może wywołać rewolucję i w efekcie usprawnić pracę całej firmy.

2. Komunikacja, nie lokalizacja

Nasi programiści pracują z Warszawy, Lublina, Tczewa, Rzeszowa, Torunia. Z dowolnego miejsca. Mamy stały kontakt, choć pracujemy niemal wyłącznie zdalnie. Efektywnie prowadzimy projekty na odległość dzięki narzędziom do wspólnej pracy i komunikacji. Na żywo widzimy się m.in. podczas spotkań z klientami, wewnętrznych prezentacji i cowtorkowych planszówek w Warszawie.

Jesteśmy szczerzy w komunikacji między sobą i z klientem. Od razu sygnalizujemy zagrożenia i nie boimy się przyznać do błędu. Umożliwiamy śledzenie postępu naszych prac – w repozytoriach kodu, codziennych stand-upach, raportach.

3. Wspieranie społeczności open source

Stawialiśmy na oprogramowanie open source zanim stało się to modne. W organizacji własnej pracy i projektach klientów bazujemy głównie na programach o otwartym kodzie źródłowym. Rzadko poprzestajemy na gotowych rozwiązaniach. Wolimy wprowadzać zmiany w kodzie, by oprogramowanie w 100% odpowiadało potrzebom. Sami też udostępniamy kod na GitHubie do dalszego rozwijania.

Co miesiąc odwdzięczamy się twórcom oprogramowania open source, w szczególności tym bez zaplecza komercyjnego. Od 2012 przekazaliśmy 90 darowizn takim projektom jak m.in.: Redmine, Matrix, Laravel, Django czy Jenkins.

4. Dobroczynność

Mamy świadomość, że świat nie kończy się na technologii. Dlatego przez ostatnie 7 lat przekazaliśmy 88 datków na rzecz potrzebujących: fundacji, stowarzyszeń, hospicjów, schronisk i konkretnych osób.

Uwrażliwienie na pomoc potrzebującym przerodziło się w wieloletnie współprace z odbiorcami darowizn. Jako technologiczny partner Stowarzyszenia mali bracia Ubogich dbamy o utrzymanie frontendu i backendu serwisu WWW oraz budowę landing pages dla okolicznościowych akcji. Z kolei Stowarzyszenie Sarcoma powierzyło nam utrzymanie i rozwój głównego serwisu oraz serwisu rejestracji na coroczny Onkobieg.

---

Jak uczciliśmy 15-lecie? Były tematyczne prezentacje, kręgle, bilard, automaty z grami, rozmowy do późna i mnóstwo śmiechu.

Zobacz więcej zdjęć z jubileuszowej kolacji:

Nie ma to jak w Światowy Dzień bez Komórki wesprzeć rozwój narzędzia związanego ze smartfonami. Co zrobić, skoro tym razem dotowane projekty open source i non-profit wskazuje nasz webowy i mobilny developer Marcin Tabaka, nazywany Tabsem.

Mobile Detect

Rozwijane od 2009 narzędzie do wykrywania rodzaju urządzenia, na którym użytkownik wyświetla stronę WWW. Działa na serwerze, dzięki czemu odbiorca treści nie odczuwa dodatkowego transferu danych.

Mobile Detect rozpoznaje takie cechy urządzenia jak:

• rodzaj: komputer, tablet, telefon komórkowy,
• nazwa i numer wersji systemu operacyjnego,
• nazwa i numer wersji przeglądarki internetowej.

W efekcie narzędzie ułatwia optymalizację strony pod kątem tabletów i smartfonów.

„Twórcy Mobile Detect nie mają łatwego zadania w czasach, gdy na rynku miesięcznie pojawiają się dziesiątki nowych urządzeń mobilnych. Należy im się wparcie, bo dostarczają przydatne narzędzie, które wykorzystujemy w wielu projektach, m.in. w serwisie Kujawskiego Fooder” – mówi Tabs.

Kuba Ułanowicz (Fundacja Dzieciom)

Cierpiący na autyzm dziecięcy podopieczny Fundacji Dzieciom „Zdążyć z pomocą”. Kuba wymaga farmakoterapii i codziennych, specjalistycznych zajęć – terapii logopedycznej, psychologicznej, ruchowej, a także integracji sensorycznej. Poza trudnościami z uspołecznieniem, chłopiec ma zespół tików przewlekłych, problemy z nerkami i poważne problemy hematologiczne wskazujące na chorobę von Willebranda.

„To już trzeci raz, kiedy w ramach sidnetowej akcji pomagania potrzebującym wskazuję na Kubę. Moja znajoma jest jego ciocią. Dziś chłopiec ma niemal 11 lat i jest w trakcie diagnozowania tików, obserwowanych pod kątem zespołu Tourette’a lub zespołu PANDAS” – mówi nasz programista.

Fundacja Dzieciom „Zdążyć z pomocą” obejmuje opieką ponad 35 tys. dzieci, głównie z porażeniem mózgowym, wadami serca, zespołem Downa, autyzmem, epilepsją, retinopatią, chorobami nowotworowymi, dystrofią mięśniową. Działa od 1998, realizując ogólnokrajowy program „Zdążyć z Pomocą” zainicjowany przez prof. Zbigniewa Religę.

Live coding, magiczne sztuczki z użyciem IDE, powtórka z najlepszych praktyk w tworzeniu czystego kodu, wyraźna granica między autoryzacją a uwierzytelnianiem. Przeczytaj subiektywne podsumowanie środowego WarsawJS Meetup.

„Intro to Authentication and Authorization with JWT and PassportJS”

Zgodnie z tematem, prelekcja była dobrym wprowadzeniem do autoryzacji i uwierzytelniania. Wyjaśniała różnice między tymi pojęciami – często mylonymi, szczególnie przez początkujących.

Artur Klajnerok pokazał i omówił przykład „Basic Auth” w aplikacji front-endowej typu SPA, gdzie backendem była aplikacja we frameworku Express w node.js. Do uwierzytelniania z dostępem dla wszystkich zalogowanych użył biblioteki PassportJS.

Prezentacja zakończyła się dość prostym przykładem użycia JSON Web Token (JWT). Ponieważ z autoryzacją i uwierzytelnianiem mam do czynienia od lat, nie miałbym nic przeciwko temu, gdyby dopiero w tym momencie prezentacja się rozpoczęła 😉

„The Importance of Clean Code”

Tetiana Platonova przypomniała, czym charakteryzuje się nieskazitelny kod – koncept zaczerpnięty z książki „Czysty kod. Podręcznik dobrego programisty”.

Za Wujkiem Bobem (Robertem C. Martinem), Tetiana zdążyła omówić:

• Nazewnictwo zmiennych i metod
  Kluczowa wytyczna: Zmienne nazywaj opisowo, metody – z użyciem czasowników, a klasy – rzeczowników.
• Strukturyzowanie kodu
  Kluczowa wytyczna: Dbaj o dobrą organizację kodu – unikaj wielu poziomów wcięć (więcej niż dwóch) i nie powtarzaj się (Don’t Repeat Yourself), tworząc osobne metody dla wspólnych fragmentów kodu.
• Komentowanie
  Kluczowa wytyczna: Unikaj komentarzy opisujących, co robi kod. Powinien być na tyle czytelny, żeby nie trzeba było go tłumaczyć.

Temat jest obszerny – nie dziwię się, że Tetiana zdążyła jedynie go zarysować.

Prelekcja, która może otwierać oczy nowicjuszom, dla mnie i innych doświadczonych developerów była szybką powtórką z treści książki. Warto raz na jakiś czas odświeżyć sobie zalecenia Wujka Boba, sięgając do książki lub jego prelekcji dostępnych online.

„Use your IDE like the pros”

Jeden z nielicznych przykładów live codingu, który po prostu nie mógł się nie udać 😉

Poza powszechnie znanymi trickami, Wojciech Przechodzeń podzielił się pomysłem na niekonwencjonalne wykorzystanie funkcji wielu kursorów. Muszę przyznać, że zaskoczył mnie, używając ich do wyciągnięcia wszystkich adresów e-mail z dużego pliku JSON. Wiedziałem, że w moim IDE jest takie narzędzie, ale nigdy nie wpadłem na to, żeby użyć go w taki sposób.

Brawo za tę prezentację!

---

Pojęcia, które często błędnie utożsamiamy, klasyk programowania i zaawansowane użycie IDE. Tematyka ostatniego meetupu połączyła entuzjastów JavaScriptu, niezależnie od poziomu umiejętności.

Co roku przed wrześniowym Onkobiegiem aktualizujemy serwis wydarzenia. Tym razem wyzwaniem było przeprojektowanie zapisów na bieg, by cały proces stał się przyjaźniejszy – także dla użytkowników z niepełnosprawnościami. A to wszystko przy ograniczonym budżecie organizacji non-profit.

W dzień startu zapisów na 12. Onkobieg dowiedz się, jak niewielkim kosztem poprawić użyteczność i dostępność serwisu rejestracji.

1. Wskaźnik progresu

Jeśli rejestracja na Twoje wydarzenie jest kilkuetapowa, to warto czytelnie przedstawić kolejne etapy. Użytkownik powinien mieć wyobrażenie o tym, ile kroków dzieli go od ukończenia procesu.

Dlatego wprowadziliśmy wskaźnik progresu, by bez ingerowania w mechanizmy zapisów, móc poinformować uczestnika Onkobiegu o postępie rejestracji.

2. Czytelność komunikatów

Podpowiedzi w formularzu powinny być na tyle czytelne, by użytkownik nie musiał domyślać się, co ma zrobić. Z kolei przyciski CTA (Call To Action) powinny konkretnie wskazywać, co stanie się po kliknięciu.

Jak zmieniły się przykładowe komunikaty na stronie Onkobiegu?

• Wypełnij to pole → Wpisz adres e-mail
• Wyślij → Zakładam konto
• Proszę podać poprawny kod pocztowy → Wpisz kod pocztowy w formacie XX-XXX
• Wydrukuj kartę startową→ Pobierz kartę startową do druku

3. Usprawnienia w formularzu

Łatwiej przejść przez formularz, gdy od razu wiadomo, które pola są wymagane. Nawet jeśli są to wszystkie pola.

Wprowadzanie danych przebiegnie jeszcze sprawniej, jeśli zrezygnujesz ze zbędnych ozdobników formularza i konieczności powtarzania raz wpisanego hasła.

Teraz nie ma wątpliwości, że wszystkie pola są wymagane. Formularz nie jest przesadnie szeroki, pola są na białym tle (wcześniej wydawały się nieaktywne), a etykiety znajdują się bezpośrednio nad polami.

Wystarczy jednorazowe wpisanie hasła, które można podejrzeć przed wysłaniem formularza.

4. Ułatwiona akceptacja zgód

Jeśli zgody zajmują zbyt wiele miejsca, a skrócenie treści nie wchodzi w grę, zawsze możesz sprawić, że optycznie będą wydawały się krótsze. Pozostaw zajawkę zgody, a jej pełną treść ukryj np. pod przyciskiem „Więcej”.

Pamiętaj, by odróżnić zgody opcjonalne od wymaganych. Dużym ułatwieniem dla użytkownika będzie możliwość zaznaczenia wszystkich zgód jednym kliknięciem.

Wystarczyło inaczej ułożyć tekst, by zgody przestały przytłaczać. Bez ingerowania w liczbę i treść zgód, zwiększyliśmy przyjazność tego etapu.

5. Wywołanie pożądanej akcji

Wskazówki wizualne nakierowują użytkowników na konkretne działania. Wyróżniaj kolorem przycisk z jedną pożądaną akcją (np. wpłatą 50 zł na cel charytatywny) spośród wszystkich dostępnych opcji.

Udział w Onkobiegu jest darmowy, ale przy rejestracji można dokonać darowizny. Wyróżniony kolorem przycisk sugeruje, jaka kwota wsparcia będzie odpowiednia.

Teraz łatwiej wybrać także numer startowy i rozmiar koszulki.

6. Dostępność dla osób z niepełnosprawnościami

Czasem niuanse decydują o tym, czy z serwisu skorzystają użytkownicy z niepełnosprawnościami. Barierą nie do przejścia może okazać się blok tekstu lub element graficzny z niskim kontrastem.

Jak zwiększyć czytelność bloków tekstu?

• zastąp justowanie wyrównaniem do lewej strony
• zmniejsz szerokość bloków tekstu
• zwiększ interlinię i odstępy między akapitami
• zastąp font szeryfowy fontem bezszeryfowym

Poza poprawą czytelności tekstów, na stronie Onkobiegu wdrożyliśmy kontrastową kolorystykę – wersję żółto-czarną.

„Czuć natchnienie i świeży powiew pomysłów. Piękne dzięki za kawał dobrej roboty!”

Szymon Bubiłek
Członek Zarządu Stowarzyszenia Sarcoma

Onkobieg – Razem po zdrowie! to organizowana przez Stowarzyszenie Sarcoma od 2008, najstarsza w Polsce charytatywna impreza biegowa o tematyce onkologicznej. Jej celem jest pozyskanie funduszy na pomoc osobom chorym na choroby nowotworowe i zamanifestowanie poparcia dla ich trudnej walki o zdrowie i życie.
12. edycja Onkobiegu odbędzie się 8 września 2019 w Warszawie.

Weź udział: https://onkobieg.pl/rejestracja-uzytkownika

Poznaj szczegóły budowy serwisu: https://sidnet.pl/realizacje/onkobieg-razem-po-zdrowie

W Ogólnopolski Dzień Dogoterapii odwdzięczamy się czworonogom za ich dobroczynny wpływ. Jak co miesiąc wspieramy także wybrany projekt open source. Tym razem inicjatywy godne naśladowania wskazał Sebastian Stasiak. Znany ze swojego zamiłowania do memów, nasz „memedżer” projektów stacjonuje na co dzień w biurze w Rawie Mazowieckiej.

Redmine

Elastyczny system open source do zarządzania projektami. Korzystają z niego między innymi agencje rządowe w USA i Japonii oraz twórcy języka programowania Ruby (użytego zresztą do napisania aplikacji Redmine). Od 9 lat prowadzimy z jego pomocą projekty wewnętrzne i te dla klientów.

Redmine pozwala nam m.in. na:

• tworzenie hierarchii projektów i zadań,
• elastyczne nadawanie ról i uprawnień,
• integrację z repozytoriami kodu,
• monitorowanie czasu pracy,
• dodawanie nowych, specyficznych funkcji.

„Redmine sam w sobie ma szeroki zakres funkcji. Jednak jego największym atutem jest możliwość dalszego rozszerzania. W zespole Sidnet stosujemy m.in. dodatkowe pluginy umożliwiające prowadzenie projektów zgodnie z filozofią Agile. Niektóre z tych rozszerzeń zbudowaliśmy sami od podstaw” – mówi Sebastian.

Schronisko w Korabiewicach

Schronisko dla zwierząt różnych gatunków, od 2012 roku należące do Fundacji Viva! Obecnie pod jego opieką znajduje się kilkaset zwierzaków – nie tylko psy i koty, ale także m.in. krowy, kozy czy lisy. Schronisko jest finansowane wyłącznie ze środków Fundacji i darowizn. Jego wolontariusze zajmują się karmieniem i leczeniem zwierząt. Budują dla nich bezpieczne i wygodne boksy, domki, budy oraz wybiegi. Prowadzą adopcje fizyczne i wirtualne.

„Znam to schronisko i wiem, że stale potrzebuje wsparcia. Wyprowadzałem tam psy jako wolontariusz. Jeden z nich szczególnie zapadł mi w pamięć. Ważył z 40 kilogramów i dawał mi popalić w drodze z boksu na wybieg, za to za bramą schroniska łagodniał i bawił się jak szczeniak. Później znalazł nowy dom nad morzem” – wspomina Sebastian.

Od kilku miesięcy regularnie uczestniczę w spotkaniach WarsawJS – społeczności profesjonalistów i entuzjastów języka JavaScript. Dzisiaj podzielę się subiektywną relacją z wczorajszych prelekcji.

„Bootcampy okiem trenera i developera”

Michał Michalczuk swoją opowieść o bootcampach oparł na statystykach. Szanuję to, że choć sam organizuje bootcampy, potrafi mówić o nich krytycznie.

Michał słusznie wskazuje na to, że: nie każdy jest dobrym materiałem na programistę, nie wszystkie polskie bootcampy są sobie równe oraz że bootcamp nie zastąpi studiów. Zdaniem prelegenta, bootcamp sprawdza się jako szybkie wprowadzenie w temat i początek dalszego rozwoju. Zdecydowanie się z tym zgadzam.

„Building high performance apps with Titanium”

Rene Pot reprezentuje amerykański Appcelerator, który od 10 lat tworzy i rozwija framework Titanium. Opowiedział o jego zaletach, porównując go do podobnych, bardziej popularnych rozwiązań: React Native czy Flutter. Zrobił nawet live demo, na którym zaprezentował, jak łatwo tworzy się aplikacje mobilne z wykorzystaniem tej technologii.

Zaciekawiło mnie, jak komercyjna firma zarabia na produkcie, który jest w 100% open source. Okazuje się, że Titanium jest utrzymywany dzięki dużym firmom. Jednocześnie, zgodnie z ideą otwartości kodu, wszystkie rozwiązania są dostępne na publicznym GitHubie.

Traktuję tę prezentację jako ciekawostkę, ponieważ nie znam ani jednej aplikacji (dużej czy małej), która została napisana w tej technologii. Sam Rene mówi, że na polskim rynku nie znalazł żadnej aplikacji opartej o Titanium.

„Call me irresponsible if I ever crash on null or undefined in JavaScript or TypeScript”

Bardzo treściwa i konkretna prezentacja. Rafał Pocztarski opowiedział o dobrych praktykach, których stosowanie pozwala uniknąć przykrych niespodzianek – błędów i crashów aplikacji.

O czym powinien pamiętać każdy JS developer?

• Walidacja danych przychodzących z API. Jeśli zakładamy, że z naszego API otrzymamy dane w takim formacie, jaki został ustalony, to narażamy się na błąd. Powinniśmy je sprawdzać i walidować.
• Spodziewanie się niespodziewanego. Zawsze powinniśmy uwzględniać wyjątkowe przypadki (edge case’y).
• Eliminowanie błędów już na etapie pisania kodu. Przed błędami typu type error, czy null pointer exception zabezpieczają m.in takie narzędzia jak: TypeScript, TSLint, Flow, TravisCI.