Witam w wielkanocnym poście o nowinkach i ciekawostkach z Internetu :)
Przeszukując Internet wzdłuż i wszerz w poszukiwaniu tematu na post trafiłem na ciekawy poradnik o CSS - CSSguidelin.es.
Został on stworzony przez Harry'ego Robertsa - konsultanta architektury front-end z Wielkiej Brytanii, więc przez osobę, która niejedno we front-endowym życiu widziała.
W podręczniku możemy przeczytać zarówno o podstawach CSS, jak i o aspektach optymalizujących nie tylko działanie, ale i czytelność pliku CSS. Przeglądając ten przewodnik po świecie Cascade Style Sheets stwierdzam, że jednak jest ona bardziej zbiorem dobrych rad i wzorców, jak pisać składnię języka. Można ją porównać do książki Czysty kod, z tym że dla CSS.
Myślę, że jak zacznę w projekcie Postownia używać CSSów, to wgryzę się mocniej w ten przewodnik. Tymczasem jeśli nie masz co robić w święta, to polecam przeczytać CSSguidelines. Zwłaszcza jak CSS to Twoje drugie imię ;)
Damian
piątek, 14 kwietnia 2017
niedziela, 9 kwietnia 2017
Postownia cz. 6
Witajcie w kolejnym poście z cyklu Postownia.
Niestety w tym tygodniu nie zrobiłem za dużo, a i to co sobie założyłem, nie do końca wyszło :(
Niestety, ale ogarnięcie się po wycieczce, EDK i powrót do domu sprawił, że nie porobiłem za dużo do projektu. A miałem, a w sumie to dalej mam, ambitny plan na dodanie uprawnień do aplikacji. Na razie dodałem tylko przy zakładaniu konta, że każdy użytkownik dostaje automatycznie uprawnienia typu user, czyli podstawowe.
W drugiej kolejności chciałem dodać, żeby użytkownik o uprawnieniach admin mógł usuwać posty wszystkich użytkowników. Niestety na tym punkcie chwilowo poległem przez asynchroniczność funkcji onload obiektu XMLHTTPRequest. Na tym punkcie skupię się w przyszłym tygodniu. Aby uzupełnić uprawnienia, chcę jeszcze stworzyć nową stroną widoczną tylko dla użytkowników o uprawnieniach admin, gdzie będą mogli zmieniać uprawnienia wszystkich użytkowników.
Życzcie powodzenia, aby udało się naprawić błąd :)
Damian
Niestety w tym tygodniu nie zrobiłem za dużo, a i to co sobie założyłem, nie do końca wyszło :(
Niestety, ale ogarnięcie się po wycieczce, EDK i powrót do domu sprawił, że nie porobiłem za dużo do projektu. A miałem, a w sumie to dalej mam, ambitny plan na dodanie uprawnień do aplikacji. Na razie dodałem tylko przy zakładaniu konta, że każdy użytkownik dostaje automatycznie uprawnienia typu user, czyli podstawowe.
W drugiej kolejności chciałem dodać, żeby użytkownik o uprawnieniach admin mógł usuwać posty wszystkich użytkowników. Niestety na tym punkcie chwilowo poległem przez asynchroniczność funkcji onload obiektu XMLHTTPRequest. Na tym punkcie skupię się w przyszłym tygodniu. Aby uzupełnić uprawnienia, chcę jeszcze stworzyć nową stroną widoczną tylko dla użytkowników o uprawnieniach admin, gdzie będą mogli zmieniać uprawnienia wszystkich użytkowników.
Życzcie powodzenia, aby udało się naprawić błąd :)
Damian
środa, 5 kwietnia 2017
Wyszperane w Internecie cz. 6
Cześć,
witam po tygodniowej przerwie w kolejnym poście o ciekawych stronach lub informacjach znalezionych przeze mnie w Internecie.
Ostatnio przeglądając fejsa w sponsorowanych postach wyskoczył mi ciekawy fanpejdż - JavaScript Weekly. Administratorzy umieszczają na nim najnowsze informacje ze świata javascriptu - przegląd frameworków, statystyki odnośnie programowania czy promowanie mało znanych bibliotek. Bardzo dobra pigułka, jeśli chodzi o JSa.
Inną inicjatywą twórców jest strona o tym samym tytule co fanpejdż - Javascript Weekly. Strona umożliwia zapisanie się do newslettera, gdzie co tydzień dostajemy najnowsze informacje ze świata javascriptu.
Więc mamy do wyrobu - albo fanpejdż, albo zapisanie się do newslettera. Tak czy siak dostajemy sporą dawkę najnowszych wieści o JSie.
Ja już się zapisałem na newsletter i polubiłem fanpejdż. A Ty?
Damian
witam po tygodniowej przerwie w kolejnym poście o ciekawych stronach lub informacjach znalezionych przeze mnie w Internecie.
Ostatnio przeglądając fejsa w sponsorowanych postach wyskoczył mi ciekawy fanpejdż - JavaScript Weekly. Administratorzy umieszczają na nim najnowsze informacje ze świata javascriptu - przegląd frameworków, statystyki odnośnie programowania czy promowanie mało znanych bibliotek. Bardzo dobra pigułka, jeśli chodzi o JSa.
Inną inicjatywą twórców jest strona o tym samym tytule co fanpejdż - Javascript Weekly. Strona umożliwia zapisanie się do newslettera, gdzie co tydzień dostajemy najnowsze informacje ze świata javascriptu.
Więc mamy do wyrobu - albo fanpejdż, albo zapisanie się do newslettera. Tak czy siak dostajemy sporą dawkę najnowszych wieści o JSie.
Ja już się zapisałem na newsletter i polubiłem fanpejdż. A Ty?
Damian
środa, 29 marca 2017
Wyszperane w Internecie cz. 5
Witajcie w kolejnej odsłonie cyklu Wyszperane w Internecie
W poprzednim poście przedstawiłem Wam bibliotekę processing.js. Dzisiaj chcę Wam opowiedzieć o kolejnej bibliotece dotyczącej grafiki - p5.js.
P5.js, tak samo jak processing.js oparty jest o ideę towarzyszącą językowi Processing. Tutaj nasuwa się pytanie - czym się w takim razie różnią? Strona Sitepoint tłumaczy to tym, że w p5.js składnia Javascriptu tłumaczona jest na język Processing, który może być uruchamiany na wielu platformach. Natomiast processing.js to konwerter kodu Processing na składnię Javascriptu. W zależności od tego, jaki umiemy język programowania (Processing, czy Javascript), takiej biblioteki używamy.
Nie będzie to dla nas dużym zaskoczeniem, jeśli napiszę, że według twórców biblioteka jest dobra do nauczenia się programowania przez artystów, nauczycieli oraz dla wszelkiej maści początkujących w tej dziedzinie.
Na cały projekt P5 składa się wiele bibliotek, które pozwalają nam manipulować obiektami HTML5, takimi jak tekst, dane wejściowe (input), obraz, dźwięk, kamera itp. Daje to ogromne możliwości do modyfikacji naszej strony, aby miała jeszcze więcej "wodotrysków".
Poniżej przedstawiam kilka przykładowych rozwiązań dla tej biblioteki, jakie znalazłem w Internecie:
Biblioteka jest dopiero w fazie rozwoju, więc nie ma dla niej edytowalnego środowiska, ale twórcy, czyli Lauren McCarthy i zebrana wokół niej społeczność będą rozwijać projekt i dodać nowe funkcjonalności.
Co ciekawe, obie biblioteki (p5.js i processing.js) nie konkurują ze sobą, ponieważ jednym ze wspierających przedsięwzięcie jest Processing Foundation - fundacja opiekująca się i rozwijająca język Processing. Dzięki temu można liczyć na to, że biblioteka będzie się rozwijała w dobrym kierunku.
Myślę, że warto obserwować ten projekt, ponieważ jest on stosunkowo nowy oraz dostarczy wielu ciekawych funkcjonalności, czekających tylko na to, aby wdrożyć je w naszym projekcie. Niech przykładem będzie dla nas strona startowa projektu. Teraz się nie dziwię, że używając p5.js mamy traktować stronę internetową jak płótno.
Damian
W poprzednim poście przedstawiłem Wam bibliotekę processing.js. Dzisiaj chcę Wam opowiedzieć o kolejnej bibliotece dotyczącej grafiki - p5.js.
P5.js, tak samo jak processing.js oparty jest o ideę towarzyszącą językowi Processing. Tutaj nasuwa się pytanie - czym się w takim razie różnią? Strona Sitepoint tłumaczy to tym, że w p5.js składnia Javascriptu tłumaczona jest na język Processing, który może być uruchamiany na wielu platformach. Natomiast processing.js to konwerter kodu Processing na składnię Javascriptu. W zależności od tego, jaki umiemy język programowania (Processing, czy Javascript), takiej biblioteki używamy.
Nie będzie to dla nas dużym zaskoczeniem, jeśli napiszę, że według twórców biblioteka jest dobra do nauczenia się programowania przez artystów, nauczycieli oraz dla wszelkiej maści początkujących w tej dziedzinie.
Na cały projekt P5 składa się wiele bibliotek, które pozwalają nam manipulować obiektami HTML5, takimi jak tekst, dane wejściowe (input), obraz, dźwięk, kamera itp. Daje to ogromne możliwości do modyfikacji naszej strony, aby miała jeszcze więcej "wodotrysków".
Poniżej przedstawiam kilka przykładowych rozwiązań dla tej biblioteki, jakie znalazłem w Internecie:
Biblioteka jest dopiero w fazie rozwoju, więc nie ma dla niej edytowalnego środowiska, ale twórcy, czyli Lauren McCarthy i zebrana wokół niej społeczność będą rozwijać projekt i dodać nowe funkcjonalności.
Co ciekawe, obie biblioteki (p5.js i processing.js) nie konkurują ze sobą, ponieważ jednym ze wspierających przedsięwzięcie jest Processing Foundation - fundacja opiekująca się i rozwijająca język Processing. Dzięki temu można liczyć na to, że biblioteka będzie się rozwijała w dobrym kierunku.
Myślę, że warto obserwować ten projekt, ponieważ jest on stosunkowo nowy oraz dostarczy wielu ciekawych funkcjonalności, czekających tylko na to, aby wdrożyć je w naszym projekcie. Niech przykładem będzie dla nas strona startowa projektu. Teraz się nie dziwię, że używając p5.js mamy traktować stronę internetową jak płótno.
Damian
wtorek, 28 marca 2017
Postownia cz. 5
Cześć,
już 5 tydzień piszę Wam o postępach w pracach nad Postownią. Od ostatniego posta dodałem kolejną funkcjonalność do projektu.
Od teraz użytkownicy mogą edytować swoje posty. Po zalogowaniu się do strony widzimy następujący widok:
Jak widzimy, użytkownik (w tym wypadku o nicku Damian) może dodać post, usunąć swój post lub dokonać edycji już istniejących. Tak samo, jak dla usuwania postów, użytkownik widzi przycisk edycji tylko przy swoich postach. Dodatkowo po stronie serwera badam, czy post, który ma być edytowany, faktycznie należy do użytkownika. Po prostu nie lubię, jak ktoś grzebie w nieswoich rzeczach. :)
Użytkownik klika w przycisk Edit i widzi takie oto coś;:
Po kliknięciu pojawia się nowe pole tekstowe z treścią posta, który edytujemy. Edytujemy post i klikamy Send (muszę jeszcze ten przycisk przenieść pod pole tekstowe). Powiedzmy, że zmienię ten post na inny o treści "Huba buba".
Na serwerze następuje zamiana treści posta i wysyłane są posty do ponownego wyświetlenia. Po przeładowaniu strony znika pole tekstowe do edycji posta.
Wiem, że wygląd strony jest dosyć ascetyczny i odpychający, ale chwilowo nie zajmuję się tutaj grafiką. Na razie poznaję tajniki Javascriptu i komunikacji na linii klient - serwer i przyznaję, że idzie mi to coraz lepiej.
W następnym tygodniu przedstawię Wam kolejną funkcjonalność, którą chcę dodać - role użytkowników.
Damian
już 5 tydzień piszę Wam o postępach w pracach nad Postownią. Od ostatniego posta dodałem kolejną funkcjonalność do projektu.
Od teraz użytkownicy mogą edytować swoje posty. Po zalogowaniu się do strony widzimy następujący widok:
 |
| Widok po zalogowaniu |
Jak widzimy, użytkownik (w tym wypadku o nicku Damian) może dodać post, usunąć swój post lub dokonać edycji już istniejących. Tak samo, jak dla usuwania postów, użytkownik widzi przycisk edycji tylko przy swoich postach. Dodatkowo po stronie serwera badam, czy post, który ma być edytowany, faktycznie należy do użytkownika. Po prostu nie lubię, jak ktoś grzebie w nieswoich rzeczach. :)
Użytkownik klika w przycisk Edit i widzi takie oto coś;:
 |
| Teraz możemy edytować post |
Po kliknięciu pojawia się nowe pole tekstowe z treścią posta, który edytujemy. Edytujemy post i klikamy Send (muszę jeszcze ten przycisk przenieść pod pole tekstowe). Powiedzmy, że zmienię ten post na inny o treści "Huba buba".
 |
| Teraz widzimy zmieniony post |
Na serwerze następuje zamiana treści posta i wysyłane są posty do ponownego wyświetlenia. Po przeładowaniu strony znika pole tekstowe do edycji posta.
Wiem, że wygląd strony jest dosyć ascetyczny i odpychający, ale chwilowo nie zajmuję się tutaj grafiką. Na razie poznaję tajniki Javascriptu i komunikacji na linii klient - serwer i przyznaję, że idzie mi to coraz lepiej.
W następnym tygodniu przedstawię Wam kolejną funkcjonalność, którą chcę dodać - role użytkowników.
Damian
niedziela, 26 marca 2017
Wyszperane w Internecie cz. 4
Cześć,
w dzisiejszym poście z cyklu Wyszperane w Internecie przedstawię Wam jedną z bibliotek Javascriptu, którą znalazłem i wydała mi się bardzo interesująca.
Mowa o processing.js. Biblioteka ta jest siostrzaną wersją języka programowania Processing, stworzonego przez Bena Fry'a i Casey Reas na MIT. Processing, wraz z całym środowiskiem IDE, miał pomagać uczyć się programowania ludziom z tym niezwiązanym. Miało to zostać osiągnięte przez efekty wizualne, jakie od razu się pojawiają po napisaniu kodu oraz jego uproszczeniu składni do tworzenie grafiki w Javie. Dlatego język ten wykorzystywany jest w sztuce elektronicznej i projektowaniu graficznym. Przełożeniem tego języka na Javascript jest właśnie biblioteka processing.js.
Twórcy biblioteki chwalą się, że jej możliwości można wykorzystać do wizualizacji danych, sztuki cyfrowej, interaktywnych animacji, tworzenia edukacyjnych wykresów, gier wideo bez używania dodatkowych pluginów.
Strona projektu zawiera wiele ciekawych przykładów wykorzystania biblioteki, jak na przykład wąż poruszający się za kursorem, interaktywne wykresy czy prosty zegar. Pod każdym przykładem jest kod, który generuje dany przykład. Jest to duży plus dla twórców.
Uważam, że biblioteka daje ogromne możliwości graficzne i nadaje się idealnie dla stron bazujących na wyświetlaniu grafiki (strony poświęcone ekonomii, blogi artystów, big data), ponieważ można osiągnąć świetne efekty przy małym nakładzie pracy i kodu. Tak więc jeśli tworzysz grafikę, a nie znasz tej biblioteki, to wiesz, co masz teraz przejrzeć :)
Damian
PS Na koniec jeszcze jeden ciekawy przykład - interaktywne akwarium
w dzisiejszym poście z cyklu Wyszperane w Internecie przedstawię Wam jedną z bibliotek Javascriptu, którą znalazłem i wydała mi się bardzo interesująca.
Mowa o processing.js. Biblioteka ta jest siostrzaną wersją języka programowania Processing, stworzonego przez Bena Fry'a i Casey Reas na MIT. Processing, wraz z całym środowiskiem IDE, miał pomagać uczyć się programowania ludziom z tym niezwiązanym. Miało to zostać osiągnięte przez efekty wizualne, jakie od razu się pojawiają po napisaniu kodu oraz jego uproszczeniu składni do tworzenie grafiki w Javie. Dlatego język ten wykorzystywany jest w sztuce elektronicznej i projektowaniu graficznym. Przełożeniem tego języka na Javascript jest właśnie biblioteka processing.js.
Twórcy biblioteki chwalą się, że jej możliwości można wykorzystać do wizualizacji danych, sztuki cyfrowej, interaktywnych animacji, tworzenia edukacyjnych wykresów, gier wideo bez używania dodatkowych pluginów.
Strona projektu zawiera wiele ciekawych przykładów wykorzystania biblioteki, jak na przykład wąż poruszający się za kursorem, interaktywne wykresy czy prosty zegar. Pod każdym przykładem jest kod, który generuje dany przykład. Jest to duży plus dla twórców.
Uważam, że biblioteka daje ogromne możliwości graficzne i nadaje się idealnie dla stron bazujących na wyświetlaniu grafiki (strony poświęcone ekonomii, blogi artystów, big data), ponieważ można osiągnąć świetne efekty przy małym nakładzie pracy i kodu. Tak więc jeśli tworzysz grafikę, a nie znasz tej biblioteki, to wiesz, co masz teraz przejrzeć :)
Damian
PS Na koniec jeszcze jeden ciekawy przykład - interaktywne akwarium
sobota, 25 marca 2017
Postownia cz. 4
Witajcie w kolejnym poście z cyklu Postownia. Tak jak co tydzień opiszę, co zrobiłem przez ostatni tydzień w projekcie.
Przechodząc do konkretów.
Dodałem kolejną funkcjonalność, która jest must have dla blogów, mikroblogów, forów itp. Mianowicie usuwanie postów.
Teraz po zalogowaniu się użytkownik widzi swoje posty wraz z przyciskiem Delete, tak jak to wygląda na screenie poniżej.
Oczywiście użytkownik może usuwać tylko swoje posty. Na zrzucie ekranu jestem zalogowany jako używkownik "Damian" i tylko mogę usunąć posty użytkownika "Damian".
Proces weryfikacji, czy faktycznie użytkownik usuwa swoje posty, jest dwuetapowy. O pierwszym etapie już wspomniałem przed chwilą. Drugim etapem jest weryfikacja po stronie serwera, czy usuwany post należy do użytkownika, który go usuwa. Jest to dodatkowe zabezpieczenia, aby nawet grzebiąc w kodzie strony, nikt niepowołany nie usuwał dowolnych postów.
Po usunięciu postu strona się odświeża z aktualną zawartością.
Myślę, że więcej nie muszę wyjaśniać. Ale jeśli macie jakieś pytania, śmiało zostawiajcie je w komentarzach. :)
Damian
Przechodząc do konkretów.
Dodałem kolejną funkcjonalność, która jest must have dla blogów, mikroblogów, forów itp. Mianowicie usuwanie postów.
Teraz po zalogowaniu się użytkownik widzi swoje posty wraz z przyciskiem Delete, tak jak to wygląda na screenie poniżej.
 | ||
| Dodałem przycisk Delete |
Oczywiście użytkownik może usuwać tylko swoje posty. Na zrzucie ekranu jestem zalogowany jako używkownik "Damian" i tylko mogę usunąć posty użytkownika "Damian".
Proces weryfikacji, czy faktycznie użytkownik usuwa swoje posty, jest dwuetapowy. O pierwszym etapie już wspomniałem przed chwilą. Drugim etapem jest weryfikacja po stronie serwera, czy usuwany post należy do użytkownika, który go usuwa. Jest to dodatkowe zabezpieczenia, aby nawet grzebiąc w kodzie strony, nikt niepowołany nie usuwał dowolnych postów.
Po usunięciu postu strona się odświeża z aktualną zawartością.
Myślę, że więcej nie muszę wyjaśniać. Ale jeśli macie jakieś pytania, śmiało zostawiajcie je w komentarzach. :)
Damian
Subskrybuj:
Posty (Atom)