Witam mam takie pytanko, programuje trochę w C++ ale chciałbym też zająć się projektowanie stron. Na początku chciałbym się pouczyć podstaw HTML5, CSS3, JAVA SCRIPT, PHP, MySQL. A dopiero jak nauczę się podstaw to przejdę to jakiś innych rozwiązań. I czy znacie jakieś książki (najlepiej jak były by połączone np na helion.pl widziałem książkę która opisuje i HTML5 i CSS3).
jakieś książki do nauki programowania stron
- Rejestracja: dni
- Ostatnio: dni
- Postów: 208
0
- Rejestracja: dni
- Ostatnio: dni
- Postów: 104
1
Z tego co pamiętam to helionie masz ładnie uporządkowane opinie różnych użytkowników jak i również ocenę książeczek. Tyle Ci się nie chce wejść i poczytać?
- Rejestracja: dni
- Ostatnio: dni
- Lokalizacja: Kraków
- Postów: 574
0
Książki - można i tak. Możesz pooglądać tutoriale w sieci (youtube i strony z kursami). Możesz zapoznać się z http://www.w3schools.com/ i dostępnymi tam materiałami.
Zainstaluj sobie wamp, xampp lub lamp (co tam chcesz i lubisz) i działaj. Dodaj do tego dobry edytor np. Sublime +Emmet lub Atom i działaj.
- Rejestracja: dni
- Ostatnio: dni
- Postów: 300
- Rejestracja: dni
- Ostatnio: dni
1
Desu napisał(a):
Step 0. Wybór edytora *Szacowany czas: - *
Polecam https://www.sublimetext.com/.Step 1. Nauka HTML Szacowany czas: max. 1 dzień
Nie ma się tutaj za bardzo nad czym rozdrabniać. Potrzebujesz wiedzieć co to jest HTML i poznać podstawowe znaczniki oraz atrybuty tych zniaczników. Ogólny template każdej strony to:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
nad tym się nie zatrzymuj. Przyjmij, że tak jest i broń boże nie zapamiętuj tych wszystkich meta tagów, które są tłumaczone w kursach bo na początku nie jest Ci to potrzebne. Skopiuj, wklej i tyle. Skup się na tagach takich jak: section, footer, header, aside, article, h1-h6, a, p, span, div, ul, ol.
**Polecane materiały: **
http://www.99lime.com/_bak/topics/you-only-need-10-tags/
http://html5doctor.com/lets-talk-about-semantics/Challenge:
Zakoduj prostą stronę. Możesz się wzorować na tej http://motherfuckingwebsite.com/.Step 2. Nauka CSS Szacowany czas: ok. tygodnia
W tym kroku nauczysz się nadawać wygląd stronie. Poznasz nowe atrybuty takie jak `class`, `id`. Trzymając się zasady pareto (znanej też pod nazwą 80/20) uczysz się najczęściej używanych rzeczy. Googluj po: *common CSS properties, most used CSS properties*.**Polecane materiały: **
http://zellwk.com/blog/9-important-css-properties-you-must-know/
http://tech.journalism.cuny.edu/documentation/css-cheat-sheet/
http://www.expression-web-tutorial.com/CSS-Properties.html#.Vyr5A2F97Hw
http://code.tutsplus.com/tutorials/10-css3-properties-you-need-to-be-familiar-with--net-16417
http://learnlayout.com/position.html WAŻNE!!
https://css-tricks.com/centering-css-complete-guide/ WAŻNE!!
https://css-tricks.com/snippets/css/a-guide-to-flexbox/ WAŻNE!!Challenge:
Ostyluj stronę, którą wczesniej zakodowałeś oraz wykonaj 1/2 templaty z dowolnej listy, polecam:
http://www.dreamtemplate.com/templates/simple-personal-css-templates.html
www.mezzoblue.com/zengarden/alldesigns/Step 3. Nauka frameworka CSS *Szacowany czas: ok. tygodnia - dwóch *
Do wyboru masz w zasadzie Bootstrap lub Foundation. Obojętne, które wybierzesz (bootstrap popularniejszy). Framework jest to szkielet do budowy aplikacji. W kroku drugim wszystko robiłeś sam, a tutaj rzeczy, które są używane bardzo często są już zrobione dla Ciebie (żebyś nie musiał wynajdywać koła od nowa).**Polecane materiały: **
http://strefakursow.pl/kursy/web_design/kurs_bootstrap_3_-_responsywne_strony.html Biję się w pierś, że to tutaj umieszczam, ale co jak co to ten kurs mi pomógł.Challenge:
Wybierz jakiś template z tej strony http://startbootstrap.com/template-categories/all/ i go sam zakoduj.Step 4. Nauka javascript Szacowany czas: dwa - trzy miesiące *
Mamy content, style to teraz czas, żeby z naszą stroną się coś działo.**Polecane materiały: **
http://helion.pl/ksiazki/programowanie-w-javascript-rusz-glowa-eric-t-freeman-elisabeth-robson,prjsrg.htmChallenge:
Zrób jakis walidator formularza, jakąś prostą karuzelę itp.https://github.com/getify/You-Dont-Know-JS
BARDZO WAŻNE
Na tym etapie powinieneś zapoznać się z metodami debugowania. Jest to bardzo wazne, a znam miliony programstów, którzy na oślep szukają błędów używającconsole.log.
Debugging JavaScript - 0 to Heisenberg
Useful JavaScript debugging tips you didn't knowChallenge:
Gra w snake'a, jakieś statki, albo mini paint w przeglądarce.Pierwsza książka łagodnie Cie wprowadzi do świata javascriptu i da poczucie, że coś umiesz.
Druga ksiązka (a raczej seria) wyprowadzi Cie z błedu, że cokolwiek umiałeś i da Ci solidną dawkę wiedzy, która będzie podstawą do dalszego rozwoju.Step 5. Nauka jQuery *Szacowany czas: miesiąc * *
jQuery to biblioteka (czy jak niektórzy mówią framework) do javascriptu. **Stąd JS uczysz się najpierw!** Tak samo jak w przypadku css, jquery daje Ci już gotowe rozwiązania do popularnych problemów, przykład:Javascript
var request = new XMLHttpRequest();
request.open('GET', '/my/url', true);
request.onload = function() {
if (request.status >= 200 && request.status < 400) {
// Success!
var data = JSON.parse(request.responseText);
} else {
// We reached our target server, but it returned an error
}
};
request.onerror = function() {
// There was a connection error of some sort
};
request.send();
To samo w jQuery:
$.getJSON('/my/url', function(data) {
});
*Źródło: youmightnotneedjquery.com *
Challenge:
Możesz przerobić swoje rozwiązania z kroku 4 z użyciem jQuery.
Warto tutaj poświęcić również trochę czasu na poczytanie kodu źródłowego np. tej karuzeli http://www.owlcarousel.owlgraphic.com/ i spróbować zrozumieć co tam się dzieje.Końcowy Challenge
Wchodzisz na tą stronę http://themeforest.net/category/all i wybierasz dowolny template, po czym kodujesz go sam od podstaw.Od tego miejsca możesz iść w kierunku Frontend (preprocesory CSS, metodyki typu BEM, SMACSS, ReactJS, AngularJS, webpack, nodejs i npm..) lub Backend. To co Ci napisałem to ogólny zarys, bo wiem, że na początku można się w tym wszystkim zgubić. Zawsze bądź głodny wiedzy i naucz się szukać informacji.
Powodzenia.
PS. Nie warto kupować materiałów ze stron typu strefakursów, czy eduweb. Wiem, że sam wyżej poleciłem jeden z nich, ale to z lenistwa. Po prostu możesz obejrzeć ten tutorial na prędkości 1.25/1.5 biorąc kąpiel i załapiesz bootstrapa (co jest łatwiejsze niż szukanie informacji w internecie). Widziałem bardzo duzą częśc materiałów od nich i lepiej na tym wyjdziesz jak kupisz sobie książkę i dobrą kawę/herbatę niż ten kurs.
* oczywiście mowa o podstawach podstaw.
- Rejestracja: dni
- Ostatnio: dni
- Postów: 208
0
Bardzo dziękuję za wszystkie odpowiedzi.