O tym, jak zrobiłam swoją pierwszą aplikację

By 17 January 2015 Get Things Done, Motywacja

Takie pytanie zadawali mi głównie niepro­gramisty­czni zna­jo­mi :) Ale tak naprawdę pomyślałam, że odpowiedź na nie jest równie cen­na dla tych, co pro­gra­mu­ją. W sum­ie, to jak zaczy­nałam nie miałam jas­no spre­cy­zowanego planu dzi­ała­nia (tu trochę pomógł Kuba, który sug­erował, co ter­az może­my robić), ale dzię­ki temu pow­stała pew­na ścież­ka, która powinien prze­jść każdy piszą­cy włas­ną aplikac­je. Na pewno moż­na to zro­bić “z innej strony”, ale wyda­je mi się, że moja kole­jność jest całkiem sensowna.

Nie przedłuża­jąc, oto moje dzi­ała­nia krok po kroku z competence.today :) wraz z komen­tarza­mi, jak mi szło :D

Pomysł

To w sum­ie nie było takie proste — bo tak naprawdę, nie miałam pomysłu na aplikację, która zmieni świat. Z resztą, zakładam, że gdy­bym miała, Kuba powiedzi­ał by :“ok, to będzie to Two­ja 2 aplikac­ja”. A to dlat­ego, że celem mojej aplikacji było — naucze­nie mnie pro­gramowa­nia. Serio! Jed­nak bez sen­su było­by tworzyć coś w sty­lu Tes­laPic­ture­O­fA­Day, albo coś co w żaden sposób mnie nie interesuje ;)

Dawno, dawno temu, kiedy miałam blo­ga o samoroz­wo­ju i ba, włas­ną fir­mę z tym związaną, myślałam z moim ówczes­nym wspól­nikiem o tym, by stworzyć jak­iś taki por­tal szkole­niowy, coś co poz­woli na wymi­anę wiedzy, ale w sum­ie nie mieliśmy pomysłu, jak to może wyglą­dać oraz umiejętności :)

Zas­tanaw­ia­jąc się, co mogę zro­bić Kuba pod­sunął pomysł, że braku­je mu takiej przestrzeni do pub­likacji kursów online, na tyle prostej by dało się z tego korzys­tać, tak o, po pros­tu. Stwierdz­iłam, ok biorę to! Ale wcale nie skończyłam na tym etapie.

Stworzyłam lean mod­el can­vas (nieste­ty nie dogrze­bałam się do niego — ale jeszcze poszper­am). Wiem, że częs­to, pro­gramiś­ci ole­wa­ją mod­el biz­ne­sowy swoich aplikacji i ogól­nie “gardzą biz­ne­sem”, ale umówmy się, nie da się zapro­jek­tować i zapro­gramować dobrze czegoś, co nie jest skon­fron­towane z potrze­ba­mi użytkown­ików. To one defini­u­ją Two­ją aplikac­je. To one potem wery­fiku­ją, czy jest to kole­j­na dzi­w­na rzecz, która ist­nieje w internecie czy coś, co naprawdę może się przy­dać i z czego, będą korzys­tać. Po pros­tu nie da się odd­zielić pro­gramowa­nia od jego rezul­tatu i o ile w fir­mie, na stanowisku pro­gramisty “ktoś to już za Ciebie zro­bi” to w swoich pro­jek­tach — musisz to zro­bić sam. Uwierz, że tak zdoby­ta wiedza pomoże Ci też w samym pro­gramowa­niu — lep­iej zrozu­miesz założe­nia biz­ne­sowe pro­jek­tów, a łatwiej będzie Ci w przyszłoś­ci pra­cow­ać z samym kodem.

To, do czego doszłam sprowadza­ło się do kilku punk­tów: po pier­wsze, że wrzu­canie treś­ci musi być proste. Po drugie, że powin­na być możli­wa opc­ja pro­filu firmy, która to booku­je szkole­nia dla swoich pra­cown­ików.  Po trze­cie, że jeśli chci­ałabym zro­bić z tego biznes, to najważniejszą rzeczą jest tak naprawdę pozyskanie spec­jal­istów, którzy mogli by tworzyć takie kursy, bo to na nich opiera się wartość aplikacji.

Serwer i domena

W dzisiejszych cza­sach wybór nazwy to tak naprawdę sprawdze­nie, czy dana dom­e­na jest wol­na. Ja korzys­tałam z godad­dy, a nazwa, przyz­na­j­cie, wyszła całkiem sexy ;) Ser­w­er mam skolei wyna­ję­ty w usłudze Ama­zon AWS, a z jego kon­fig­u­racją poma­gał mi Kuba (choć poradz­iłabym sobie też sama, bo są fajne tuto­ri­ale).

Projekt

Po anal­izie i wyszczegól­nie­niu, czego potrze­bu­ję przyszedł czas na zapro­jek­towanie struk­tu­ry aplikacji. Zaczęłam od dia­gramów przy­pad­ków uży­cia. Poszukałam jakiegoś prostego narzędzia do tworzenia dia­gramów UML, jest tego masa, na pewno coś zna­jdziecie, ja korzys­tałam ze StarUML. A owoc mojej pra­cy zna­jdziecie poniżej. Wyszczegól­niłam trzy typy użytkown­ików: user, author, company.

Use Cases

Kole­jnym dia­gramem był dia­gram klas, który pokazu­je szczegóły na tem­at danych, jakie prze­chowu­je­my w systemie.

Dzię­ki niemu wiedzi­ałam, jak ma wyglą­dać domena(tak, wiem domeną nazy­wamy też adres, pod którym jest on widoczny w sieci, ale tutaj chodzi o domenę, jako wycinek rzeczy­wis­toś­ci) mojej aplikacji. Zaz­nac­zona na różowo klasa Course, została wybrana jako cen­tral­na w aplikacji.

 

Main

 

Cieka­wost­ka: Zobacz­cie jak dia­gramy wyglą­dały po uży­ciu ;) — Miałam je cały czas pod ręką i naprawdę dawały mi duu­użo infor­ma­cji o mojej aplikacji.

20150117_122551

Dia­gramy po napisa­niu aplikacji wyglą­da­ją mniej więcej tak :)

 

Widoki

To chy­ba najbardziej żmud­na (dla mnie!) część związana z aplikacją, a moje jęki słyszeli pewnie wszyscy sąsiedzi. Nieste­ty, albo i ste­ty nie moż­na uciec od front-endu, więc grzecznie edy­towałam htmle ;)

Nie pory­wałam się z motyką na słońce, nie chci­ałam też wszys­tkiego robić sama więc szablon html kupiłam na The­me­For­est. Eh, ale i tak spędz­iłam mil­iony godzin* na jego edy­cji (*w moim odczu­ciu każ­da min­u­ta pra­cy w HTM­Lu trwa jakieś pół godziny :)).

Stworzyłam więc wszys­tkie wido­ki (a razem z nimi kon­trol­ery), ale w wer­sji staty­cznej, cza­sem też do wiadomej poprawy :). To było coś, co bard­zo ode­j­mowało mi motywacji i było zwycza­jnie żmudne. Nie jestem mis­trzem HTM­La więc pier­wsze godziny były naprawdę walką z niepoza­mykany­mi </div>ami. Potem, było na szczęś­cie tylko proś­ciej, a pod koniec, noo całkiem przy­jem­nie i Kuba śmi­ał się ze mnie, że może jed­nak front-end.

Warto tutaj wspom­nieć o boot­strapie, dzię­ki które­mu wiele rzeczy miałam na gotowo (pom­nik dla twórców!).

W rezulta­cie, oga­r­nęłam staty­cznie więk­szość widoków w mojej aplikacji.

Domena

Czyli tworze­nie obiek­tów i encji. Dzię­ki dia­gramom i anal­izie ich było to naprawdę proste. Warto pamię­tać, że na początku nie ma co przewidy­wać wszys­tkiego i zas­tanaw­iać się co jeszcze jest potrzeb­ne. Dobrze napisana aplikac­ja pozwala na dopisy­wanie nowych rzeczy i mody­fikac­je — ja np. zupełnie zapom­ni­ałam o haśle do logowa­nia :) No, ale nie był to problem.

Operacje

Po stworze­niu dome­ny, przyszedł czas na DAO i ser­wisy. Początkowo wynika­ją one z dome­ny — odczyt, zapis, aktu­al­iza­c­ja i nasze przy­pad­ki uży­cia, a później uzu­pełniłam je o konkretne metody i funkc­je, które wynika­ją z bieżą­cych potrzeb. Warto dodać, że moja wiedza w zakre­sie SQL nie jest powala­ją­ca, ale w zupełnoś­ci wystar­czyła do stworzenia obsłu­gi bazy danych — thanks to Spring! I naprawdę, jeśli robi­cie coś swo­jego, to korzys­tanie z  zapy­tań SQLowych powin­no być tym wyjś­ciem awaryjnym, bo mamy tak wspani­ałe narzędzia jak Spring czy JPA (tak, właśnie w takiej kole­jnoś­ci) i jeśli one Ci nie pomogą to dopiero wtedy korzys­taj z zapytań ;))

Podpięcie danych

Pole­ga na wyko­rzys­ta­niu ser­wisów w kon­trol­er­ach, wyświ­et­la­niu na widokach danych z bazy danych, doda­niu wal­i­dacji danych, obsłu­gi for­mu­la­rzy do ich wprowadza­nia. To był chy­ba naj­fa­jniejszy etap, bo łączył ze sobą wszys­tkie poprzed­nie — mogłam w końcu coś przek­likać, sprawdz­ić, dos­tosować, a z drugiej strony dość wyma­ga­ją­cy- w krótkim cza­sie musi­ałam wyszukać bard­zo dużo wiedzy i szy­bko ją dos­tosować do swo­jej aplikacji. Moż­na też powiedzieć, że w tym etapie mieś­cił się kolejny…

Walidacja wcześniejszych założeń i zmiany

Nagle okaza­ło się, że czegoś braku­je, albo, że wcześniej rozk­miniłam coś zupełnie bez sen­su i jest to niepotrzeb­ne. Np. początkowo nie prze­chowywałam infor­ma­cji o postę­pach danego użytkown­i­ka w ramach kur­su, co ter­az wyda­je mi się pod­sta­wowe i kluc­zowe — for­mu­la­rz oce­ny kur­su powinien być dostęp­ny po ostat­niej lekcji, jak i możli­wość wygen­erowa­nia certyfikatu :)

Rozwój i utrzymanie :)

O i właśnie, jak widzi­cie, wcale nie skończyłam! Do uru­chomienia pozosta­je mod­uł dla firm, wspom­ni­ane wcześniej oce­ny kursów, możli­wość rekomen­dacji innym użytkown­ikom, czy cho­ci­aż­by pod­pię­cie płat­noś­ci, tu muszę skolei poczekać na pay­pal ;)) ale, to, co zro­biłam w zupełnoś­ci wystar­czyło, by ją uru­chomić. Pier­wszego dnia lin­ka dostali tylko wybrani i podsyłali mi bugi i niedo­pra­cow­a­nia, a ja jak pszczół­ka wszys­tko napraw­iałam. No i jasne, tak to powin­no wyglą­dać. Tes­tu­je­my, szukamy, rozwiązu­je­my prob­le­my, bo znowu nie da się zro­bić w 100% dzi­ała­jącej aplikacji (cho­ci­aż­by literów­ki, popraw­ki w htmlu).

Tak wyglą­dało tworze­nie com­pe­tence. today. I właśnie moja dro­ga od pomysłu do real­iza­cji zain­spirowała nas do stworzenia ebooka o takiej pra­cy. Chce­my w sposób przys­tęp­ny i zwięzły opisać wszys­tko, co niezbędne do stworzenia pier­wszej aplikacji, nieza­leżnie od wybranej tech­nologii ;) To nasz pro­jekt na wios­nę, ale już niedłu­go zbierze­my grupę do pomo­cy nam — więcej zna­jdziecie na blogu.