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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
|
---
title: Front-end web developer
slug: Learn/Front-end_web_developer
translation_of: Learn/Front-end_web_developer
---
<p>{{learnsidebar}}</p>
<p>Bem-vindos ao roteiro de aprendizado em desenvolvimento web front-end!</p>
<p>Aqui disponibilizamos tudo o que precisas para te tornares um desenvolvedor Web front-end. Simplesmente trabalha cada secção deste curso, aprendendo novas habilidades (ou melhorando as que já tens) á medida que avanças. <span>Cada secção inclui exercicios e avaliações para testar a tua compreensão antes de avançares para proxima.</span></p>
<h2 id="Temas_abrangidos">Temas abrangidos</h2>
<p>Os temas abrangidos são:</p>
<ul>
<li>Preparação básica e aprender como estudar</li>
<li>Normas da Web e boas práticas (como por exemplo acessibilidade e compatibilidade entre navegadores)</li>
<li>HTML, a linguaguem de marcacao que proporciona a estrutura do conteudo web e seu significado</li>
<li>CSS, a linguaguem usada para estilizar as paginas web</li>
<li>JavaScript, a linguagem de definicoes usada para criar interacoes na web</li>
<li>Ferramentas que sao usadas para facilitar o desenvolvimento web moderno do lado do cliente</li>
</ul>
<p>Sinta-se livre para trabalhar nas seccoes por ordem, mas cada uma e tambem independente. Por exemplo, se voce ja domina HTML, podes seguir para a seccao de CSS.</p>
<h2 id="Pre_requisitos">Pre requisitos</h2>
<p>Voce nao precisa de nenhum conhecimento anterior para este curso. Tudo que precisas e de um computador que possa operar um navegador moderno, conexao a internet, e boa vontade para aprender.</p>
<p>Se nao estiveres seguro de que desenvolvimento web front-end e para si, e/ou voce quer uma introducao mais gentil antes de iniciar um curso mais longo e completo, trabalhe no nosso modulo <a href="/en-US/docs/Learn/Getting_started_with_the_web">Iniciando com a web</a> (ingles) primeiramente.</p>
<h2 id="Obtendo_ajuda">Obtendo ajuda</h2>
<p>Nos tentamos tornar o aprendizado de desenvolvimento web front-end mais confortavel possivel, mas provavelmente voce ainda fique bloqueado porque nao percebe alguma coisa, ou algum codigo ainda nao esteje funcionando.</p>
<p>Nao entre em panico. Todos nos bloqueamos, quando somos iniciantes ou desenvolvedores web profissionais. O artigo <a href="/en-US/docs/Learn/Learning_and_getting_help">Estudando e obtendo ajuda</a> (ingles) e proporcionado a ti com uma serie de dicas para encontrares informacoes e auto ajudas. Se ainda assim continuas bloqueado, sinta se avontade para postar uma pergunta no nosso <a href="https://discourse.mozilla.org/c/mdn/learn/">Forum discussao</a> (ingles).</p>
<p>Vamos iniciar. Boa sorte!</p>
<h2 id="O_roteiro_de_aprendizagem">O roteiro de aprendizagem</h2>
<h3 id="Iniciando">Iniciando</h3>
<p>Tempo de duracao: 1.5–2 horas</p>
<h4 id="Pre_requisitos_2">Pre requisitos</h4>
<p>Nada mais, excepto um basico dominio computacional.</p>
<h4 id="Como_saberei_que_estou_pronto_para_continuar">Como saberei que estou pronto para continuar?</h4>
<p>Nao ha avaliacoes nesta seccao do curso. Mas certifique se de nao ignora-la. E importante que voce esteja preparado para trabalhar com os proximos exercicios do curso.</p>
<h4 id="Guias">Guias</h4>
<ul>
<li><a href="/en-US/docs/Learn/Getting_started_with_the_web/Installing_basic_software">Instalando softwares basicos</a> (ingles)— configurando as ferramentas basicas (15 min leitura)</li>
<li><a href="/en-US/docs/Learn/Getting_started_with_the_web/The_web_and_web_standards">Segundo plano da web e seus principios</a> (ingles)—(45 min leitura)</li>
<li><a href="/en-US/docs/Learn/Learning_and_getting_help">Aprendendo e obtendo ajuda</a> (ingles)—(45 min leitura)</li>
</ul>
<h3 id="Semantica_e_estruturas_com_HTML">Semantica e estruturas com HTML</h3>
<p>Tempo de duracao: 35–50 horas</p>
<h4 id="Pre_requisitos_3">Pre requisitos</h4>
<p>Nada mais, excepto um basico dominio computacional e um basico ambiente de desenvolvimento web.</p>
<h4 id="Como_saberei_que_estou_pronto_para_continuar_2">Como saberei que estou pronto para continuar?</h4>
<p>As avaliacoes em cada modulo estao designadas para testar o teu conhecimento sobre a importancia do assunto. A conclusao das avaliacoes confirma que estas pronto a seguir para o proximo modulo.</p>
<h4 id="Modulos">Modulos</h4>
<ul>
<li><a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">Introducao ao HTML</a> (ingles)—(15–20 horas leitura/exercicios)</li>
<li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding">Multimedia and incorporacao</a> (ingles)—(15–20 horas leitura/exercicios)</li>
<li><a href="/en-US/docs/Learn/HTML/Tables">tabelas com HTML</a> (ingles)—(5–10 horas leitura/exercicios)</li>
</ul>
<h3 id="Estilizando_e_organizando_com_CSS">Estilizando e organizando com CSS</h3>
<p>Tempo de duracao: 90–120 horas</p>
<h4 id="Pre_requisitos_4">Pre requisitos</h4>
<p>E recomendavel que voce tenha um conhecimento basico sobre HTML antes de comecar a aprender CSS. Deves no minimo estudar primeiramente a <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">Introducao ao HTML</a> (ingles).</p>
<h4 id="Como_saberei_que_estou_pronto_para_continuar_3">Como saberei que estou pronto para continuar?</h4>
<p>As avaliacoes em cada modulo estao designadas para testar o teu conhecimento sobre a importancia do assunto. A conclusao das avaliacoes confirma que estas pronto a seguir para o proximo modulo.</p>
<h4 id="Modulos_2">Modulos</h4>
<ul>
<li><a href="/en-US/docs/Learn/CSS/First_steps">CSS primeiros passos</a> (ingles)–(10–15 horas leitura/exercicios)</li>
<li><a href="/en-US/docs/Learn/CSS/Building_blocks">CSS construindo blocos</a> (ingles)–(35–45 horas leitura/exercicios)</li>
<li><a href="/en-US/docs/Learn/CSS/Styling_text">Estilizando textos</a> (ingles)–(15–20 horas leitura/exercicios)</li>
<li><a href="/en-US/docs/Learn/CSS/CSS_layout">CSS organizacao</a> (ingles)–(30–40 horas leitura/exercicios)</li>
</ul>
<h4 id="Fontes_extras">Fontes extras</h4>
<ul>
<li><a href="/en-US/docs/Web/CSS/Layout_cookbook">CSS organizacao cookbook</a> (ingles)</li>
</ul>
<h3 id="Interacao_com_JavaScript">Interacao com JavaScript</h3>
<p>Tempo de duracao: 135–185 horas</p>
<h4 id="Pre_requisitos_5">Pre requisitos</h4>
<p>E recomendavel que voce tenha um conhecimento basico sobre HTML antes de comecar a aprender JavaScript. Deves no minimo estudar primeiramente a <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">Introducao ao HTML</a> (ingles).</p>
<h4 id="Como_saberei_que_estou_pronto_para_continuar_4">Como saberei que estou pronto para continuar?</h4>
<p>As avaliacoes em cada modulo estao designadas para testar o teu conhecimento sobre a importancia do assunto. A conclusao das avaliacoes confirma que estas pronto a seguir para o proximo modulo.</p>
<h4 id="Modulos_3">Modulos</h4>
<ul>
<li><a href="/en-US/docs/Learn/JavaScript/First_steps">JavaScript primeiros passos</a> (ingles)–(30–40 horas leitura/exercicios)</li>
<li><a href="/en-US/docs/Learn/JavaScript/Building_blocks">JavaScript construindo blocos</a> (ingles)–(25–35 horas leitura/exercicios)</li>
<li><a href="/en-US/docs/Learn/JavaScript/Objects">Introducao aos objectos JavaScript</a> (ingles)–(25–35 horas leitura/exercicios)</li>
<li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs">Client-side web APIs</a> (30–40 horas leitura/exercicios)</li>
<li><a href="/en-US/docs/Learn/JavaScript/Asynchronous">Asynchronous JavaScript</a> (25–35 horas leitura/exercicios)</li>
</ul>
<h3 id="Formularios_web_—_Trabalhando_com_dados_de_usuario">Formularios web — Trabalhando com dados de usuario</h3>
<p>Tempo de duracao: 40–50 horas</p>
<h4 id="Pre_requisitos_6">Pre requisitos</h4>
<p>Formularios requerem conhecimento sobre HTML, CSS e JavaScript. A complexidade em trabalhar com formularios fazem deste um topico dedicado.</p>
<h4 id="Como_saberei_que_estou_pronto_para_continuar_5">Como saberei que estou pronto para continuar?</h4>
<p>As avaliacoes em cada modulo estao designadas para testar o teu conhecimento sobre a importancia do assunto. A conclusao das avaliacoes confirma que estas pronto a seguir para o proximo modulo.</p>
<h4 id="Modulos_4">Modulos</h4>
<ul>
<li><a href="/en-US/docs/Learn/Forms">Formularios web </a>(ingles)–(40–50 hours)</li>
</ul>
<h3 id="Fazendo_o_trabalho_de_web_para_todos">Fazendo o trabalho de web para todos</h3>
<p>Tempo de duracao: 60–75 horas</p>
<h4 id="Pre_requisitos_7">Pre requisitos</h4>
<p>Seria uma otima ideia conhecer sobre HTML, CSS e JavaScript antes de trabalhar nesta seccao. Inclui outras tecnicas e boas praticas em contacto com multiplas tecnologias.</p>
<h4 id="Como_saberei_que_estou_pronto_para_continuar_6">Como saberei que estou pronto para continuar?</h4>
<p>As avaliacoes em cada modulo estao designadas para testar o teu conhecimento sobre a importancia do assunto. A conclusao das avaliacoes confirma que estas pronto a seguir para o proximo modulo.</p>
<h4 id="Modulos_5">Modulos</h4>
<ul>
<li><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing">Testando a Compatibilidade entre navegadores</a> (ingles)–(25–30 horas leitura/exercicios)</li>
<li><a href="/en-US/docs/Learn/Accessibility">Acessibilidade</a> (ingles)–(20–25 horas leitura/exercicios)</li>
</ul>
<h3 id="Ferramentas_modernas">Ferramentas modernas</h3>
<p>Tempo de duracao: 55–90 horas</p>
<h4 id="Pre_requisitos_8">Pre requisitos</h4>
<p>Seria uma otima ideia conhecer sobre HTML, CSS e JavaScript antes de trabalhar nesta seccao, tal como ferramentas abordadas que trabalham em conjunto com muitas destas tecnologias.</p>
<h4 id="Como_saberei_que_estou_pronto_para_continuar_7">Como saberei que estou pronto para continuar?</h4>
<p>Nao ha avaliacoes especificas nos artigos definidos neste modulo. Os tutoriais de estudo de caso no final do segundo e terceiro modulo preparar-te-ao para dominar o essencial sobre as ferramentas modernas.</p>
<h4 id="Modulos_6">Modulos</h4>
<ul>
<li><a href="/en-US/docs/Learn/Tools_and_testing/GitHub">Git i GitHub</a> (ingles)–(5 horas leitura)</li>
<li><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools">Compreendendo as ferramentas para desenvolvimento web client-side</a> (ingles)–(20–25 horas leitura)</li>
<li>
<p><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks">Compreendendo as estruturas client-side JavaScript</a> (ingles)–(30-60 horas leitura/exercicios)</p>
</li>
</ul>
|