SlideShare uma empresa Scribd logo
1 de 15
Luiz Felipe F. M. Costa
http://thenets.org/phelip




 Parte 1 - O poder das aplicações Web
   Meu nome é Luiz Felipe F. M. Costa.
   Aluno de Sistemas de Informação na
    UNIFEI.
   Estudo web front-end por conta.
   Meu site: http://TheNets.org/
   Meu email: phelip@thenets.org
   Você pode aprender os princípios nesse
    pouco tempo de aula, mas vai levar a vida
    toda se especializando.
   Não pretendo ensinar a fazer sites como
    o do Google ou do Facebook.

   Objetivo
     Entender como um site funciona.
     Descobrir o poder das aplicações web.
     Descobrir qual o caminho seguir para
     aprender a desenvolver para web.
1.   Front-end e back-end.
2.   O que é HTML5?
3.   Instalando Apache+MySQL.
4.   O que é PHP?
5.   Criando meu próprio website.
6.   Onde aprender?


•    Parte 1: de 1 a 2
•    Parte 2: de 3 a 6
   P – Playgrounds
     TecMundo
     Chrome Experiments
     Mozilla Demo Studio
Tirinha
   É processador no cliente
   Interface gráfica
   Exemplos de linguagens:
     HTML
     CSS
     JS
   É processador no servidor
   É seguro (para informações importantes)
   Exemplos de linguagens:
     PHP
     Ruby on Rails
     Python
     ASP.NET
     JSP
   1991   HTML
   1994   HTML2
   1996   CSS1+JavaScript
   1997   HTML4
   1998   CSS2
   2000   XHTML1
   2002   Tableless Web Design
   2005   Ajax
   2009   HTML5
   HTML5 ~= HTML + CSS + JS

   HTML5ROCKS:
    http://slides.html5rocks.com/#formula-
    intro-slide
   https://developer.mozilla.org/media/uploads/demos/b/o/boblemarin/5cfea13ba1397f6
    96bea7b2ff62c0188/fluid_1339407870_demo_package/index.html
   xD com certeza!
   Grooveshark
   Google+
   Google Drive
   Dropbox
   AirDroid
   SlideShare
   Wordpress.org
   Joomla
   Administrador dos projetos TheNets.org
   Aluno de Sistemas de Informação na
    UNIFEI.
   Meu site:
     http://TheNets.org/
   Meu email:
     phelip@thenets.org
   Meu twitter:
     http://twitter.com/TheNets

Mais conteúdo relacionado

Mais procurados

Springpoint São Paulo 2016 - Vinícius Lourenço | WordPress for Dummies
Springpoint São Paulo 2016 - Vinícius Lourenço | WordPress for DummiesSpringpoint São Paulo 2016 - Vinícius Lourenço | WordPress for Dummies
Springpoint São Paulo 2016 - Vinícius Lourenço | WordPress for DummiesVinícius Lourenço
 
CMS Livres Gestao de conhecimento para web
CMS Livres   Gestao de conhecimento para webCMS Livres   Gestao de conhecimento para web
CMS Livres Gestao de conhecimento para webPaulino Michelazzo
 
WordPress como CMS
WordPress como CMSWordPress como CMS
WordPress como CMSleogermani
 
Como eu aprendo WordPress?
Como eu aprendo WordPress?Como eu aprendo WordPress?
Como eu aprendo WordPress?Breno Alves
 
Dicas e truques para desenvolver projetos web utilizando WordPress
Dicas e truques para desenvolver projetos web utilizando WordPressDicas e truques para desenvolver projetos web utilizando WordPress
Dicas e truques para desenvolver projetos web utilizando WordPressLeo Baiano
 
Instalando Drupal, Começando do Começo
Instalando Drupal, Começando do ComeçoInstalando Drupal, Começando do Começo
Instalando Drupal, Começando do Começosauloamui
 
Como instalar o WordPress no seu computador
Como instalar o WordPress no seu computadorComo instalar o WordPress no seu computador
Como instalar o WordPress no seu computadorRudá Almeida
 
Apresentação sobre Drupal
Apresentação sobre DrupalApresentação sobre Drupal
Apresentação sobre DrupalWebdrop
 
Estilizando temas de WordPress
Estilizando temas de WordPressEstilizando temas de WordPress
Estilizando temas de WordPressAnyssa Ferreira
 
Jetpack, um Canivete Suíço no seu WordPress (WordCamp São Paulo 2014)​
Jetpack, um Canivete Suíço no seu WordPress (WordCamp São Paulo 2014)​Jetpack, um Canivete Suíço no seu WordPress (WordCamp São Paulo 2014)​
Jetpack, um Canivete Suíço no seu WordPress (WordCamp São Paulo 2014)​Valério Souza
 
NOSQLBA 2018 - ArangoDB com python
NOSQLBA 2018 - ArangoDB com pythonNOSQLBA 2018 - ArangoDB com python
NOSQLBA 2018 - ArangoDB com pythonfelipe bastosweb
 
Apresentação de defesa final de estágio
Apresentação de defesa final de estágioApresentação de defesa final de estágio
Apresentação de defesa final de estágioLeonardo Flores
 
JavaScript e o perfil do desenvolvedor front end das atualidades mais atuais
JavaScript e o perfil do desenvolvedor front end das atualidades mais atuaisJavaScript e o perfil do desenvolvedor front end das atualidades mais atuais
JavaScript e o perfil do desenvolvedor front end das atualidades mais atuaisWilliam Oliveira
 
Cms Livres - Não Reinventando a Roda no Desenvolvimento Web
Cms Livres - Não Reinventando a Roda no Desenvolvimento WebCms Livres - Não Reinventando a Roda no Desenvolvimento Web
Cms Livres - Não Reinventando a Roda no Desenvolvimento WebPaulino Michelazzo
 

Mais procurados (20)

Ppt Flex Mania
Ppt Flex ManiaPpt Flex Mania
Ppt Flex Mania
 
Springpoint São Paulo 2016 - Vinícius Lourenço | WordPress for Dummies
Springpoint São Paulo 2016 - Vinícius Lourenço | WordPress for DummiesSpringpoint São Paulo 2016 - Vinícius Lourenço | WordPress for Dummies
Springpoint São Paulo 2016 - Vinícius Lourenço | WordPress for Dummies
 
CMS Livres Gestao de conhecimento para web
CMS Livres   Gestao de conhecimento para webCMS Livres   Gestao de conhecimento para web
CMS Livres Gestao de conhecimento para web
 
WordPress como CMS
WordPress como CMSWordPress como CMS
WordPress como CMS
 
Como eu aprendo WordPress?
Como eu aprendo WordPress?Como eu aprendo WordPress?
Como eu aprendo WordPress?
 
Dicas e truques para desenvolver projetos web utilizando WordPress
Dicas e truques para desenvolver projetos web utilizando WordPressDicas e truques para desenvolver projetos web utilizando WordPress
Dicas e truques para desenvolver projetos web utilizando WordPress
 
Joomla no mercado de trabalho
Joomla no mercado de trabalhoJoomla no mercado de trabalho
Joomla no mercado de trabalho
 
Instalando Drupal, Começando do Começo
Instalando Drupal, Começando do ComeçoInstalando Drupal, Começando do Começo
Instalando Drupal, Começando do Começo
 
Como instalar o WordPress no seu computador
Como instalar o WordPress no seu computadorComo instalar o WordPress no seu computador
Como instalar o WordPress no seu computador
 
Apresentação sobre Drupal
Apresentação sobre DrupalApresentação sobre Drupal
Apresentação sobre Drupal
 
Estilizando temas de WordPress
Estilizando temas de WordPressEstilizando temas de WordPress
Estilizando temas de WordPress
 
Leonardo g
Leonardo gLeonardo g
Leonardo g
 
It's Javascript Time
It's Javascript TimeIt's Javascript Time
It's Javascript Time
 
Joomla desenvolvimento
Joomla desenvolvimentoJoomla desenvolvimento
Joomla desenvolvimento
 
Jetpack, um Canivete Suíço no seu WordPress (WordCamp São Paulo 2014)​
Jetpack, um Canivete Suíço no seu WordPress (WordCamp São Paulo 2014)​Jetpack, um Canivete Suíço no seu WordPress (WordCamp São Paulo 2014)​
Jetpack, um Canivete Suíço no seu WordPress (WordCamp São Paulo 2014)​
 
NOSQLBA 2018 - ArangoDB com python
NOSQLBA 2018 - ArangoDB com pythonNOSQLBA 2018 - ArangoDB com python
NOSQLBA 2018 - ArangoDB com python
 
Joomla
JoomlaJoomla
Joomla
 
Apresentação de defesa final de estágio
Apresentação de defesa final de estágioApresentação de defesa final de estágio
Apresentação de defesa final de estágio
 
JavaScript e o perfil do desenvolvedor front end das atualidades mais atuais
JavaScript e o perfil do desenvolvedor front end das atualidades mais atuaisJavaScript e o perfil do desenvolvedor front end das atualidades mais atuais
JavaScript e o perfil do desenvolvedor front end das atualidades mais atuais
 
Cms Livres - Não Reinventando a Roda no Desenvolvimento Web
Cms Livres - Não Reinventando a Roda no Desenvolvimento WebCms Livres - Não Reinventando a Roda no Desenvolvimento Web
Cms Livres - Não Reinventando a Roda no Desenvolvimento Web
 

Destaque

HTML5 Mobile Aula 1
HTML5 Mobile Aula 1HTML5 Mobile Aula 1
HTML5 Mobile Aula 1Jose Berardo
 
Mercado Front-End no Brasil e no mundo
Mercado Front-End no Brasil e no mundoMercado Front-End no Brasil e no mundo
Mercado Front-End no Brasil e no mundoRodrigo Nogueira
 
Front-end Development
Front-end DevelopmentFront-end Development
Front-end DevelopmentEdy Segura
 
Engenharia de front end de alta performance
Engenharia de front end de alta performanceEngenharia de front end de alta performance
Engenharia de front end de alta performanceAnderson Solano
 
Hugo Brioso | Website Design, Development & Internet Marketing | Graphic Desi...
Hugo Brioso | Website Design, Development & Internet Marketing | Graphic Desi...Hugo Brioso | Website Design, Development & Internet Marketing | Graphic Desi...
Hugo Brioso | Website Design, Development & Internet Marketing | Graphic Desi...Hugo Brioso
 
Creative Pedagogy and Mobile Education
Creative Pedagogy and Mobile EducationCreative Pedagogy and Mobile Education
Creative Pedagogy and Mobile EducationKeywords English
 
SASS + COMPASS - Alta Produtividade no Front-end
SASS + COMPASS - Alta Produtividade no Front-endSASS + COMPASS - Alta Produtividade no Front-end
SASS + COMPASS - Alta Produtividade no Front-endAnderson Aguiar
 
Os mitos do desenvolvimento front-end
Os mitos do desenvolvimento front-endOs mitos do desenvolvimento front-end
Os mitos do desenvolvimento front-endZeno Rocha
 
O Papel do desenvolvedor Front End
O Papel do desenvolvedor Front EndO Papel do desenvolvedor Front End
O Papel do desenvolvedor Front EndRael Max
 
Aula 1 linguagem html (1)
Aula 1   linguagem html (1)Aula 1   linguagem html (1)
Aula 1 linguagem html (1)Kaoru Hatake
 
Evoluindo a arquitetura de uma aplicação com AngularJS
Evoluindo a arquitetura de uma aplicação com AngularJSEvoluindo a arquitetura de uma aplicação com AngularJS
Evoluindo a arquitetura de uma aplicação com AngularJSRodrigo Branas
 
AngularJS Abraçando o MVC Client-Side
AngularJS Abraçando o MVC Client-SideAngularJS Abraçando o MVC Client-Side
AngularJS Abraçando o MVC Client-SideSergio Azevedo
 
Criando uma arquitetura de front-end do zero
Criando uma arquitetura de front-end do zeroCriando uma arquitetura de front-end do zero
Criando uma arquitetura de front-end do zeroEduardo Shiota Yasuda
 
Estrutura de um Front-End eficiente (para iniciantes)
Estrutura de um Front-End eficiente (para iniciantes)Estrutura de um Front-End eficiente (para iniciantes)
Estrutura de um Front-End eficiente (para iniciantes)Sérgio Vilar
 
Criando aplicações Single-Page com AngularJS
Criando aplicações Single-Page com AngularJSCriando aplicações Single-Page com AngularJS
Criando aplicações Single-Page com AngularJSRodrigo Branas
 

Destaque (20)

Html 01
Html 01Html 01
Html 01
 
HTML
HTMLHTML
HTML
 
HTML5 Mobile Aula 1
HTML5 Mobile Aula 1HTML5 Mobile Aula 1
HTML5 Mobile Aula 1
 
Mercado Front-End no Brasil e no mundo
Mercado Front-End no Brasil e no mundoMercado Front-End no Brasil e no mundo
Mercado Front-End no Brasil e no mundo
 
Front-end Development
Front-end DevelopmentFront-end Development
Front-end Development
 
Engenharia de front end de alta performance
Engenharia de front end de alta performanceEngenharia de front end de alta performance
Engenharia de front end de alta performance
 
Hugo Brioso | Website Design, Development & Internet Marketing | Graphic Desi...
Hugo Brioso | Website Design, Development & Internet Marketing | Graphic Desi...Hugo Brioso | Website Design, Development & Internet Marketing | Graphic Desi...
Hugo Brioso | Website Design, Development & Internet Marketing | Graphic Desi...
 
Html básico 4 tabelas
Html básico 4   tabelasHtml básico 4   tabelas
Html básico 4 tabelas
 
Creative Pedagogy and Mobile Education
Creative Pedagogy and Mobile EducationCreative Pedagogy and Mobile Education
Creative Pedagogy and Mobile Education
 
SASS + COMPASS - Alta Produtividade no Front-end
SASS + COMPASS - Alta Produtividade no Front-endSASS + COMPASS - Alta Produtividade no Front-end
SASS + COMPASS - Alta Produtividade no Front-end
 
Resumo html 2012 exercícios 01 21
Resumo html 2012   exercícios 01 21Resumo html 2012   exercícios 01 21
Resumo html 2012 exercícios 01 21
 
SEO para Front-End
SEO para Front-EndSEO para Front-End
SEO para Front-End
 
Os mitos do desenvolvimento front-end
Os mitos do desenvolvimento front-endOs mitos do desenvolvimento front-end
Os mitos do desenvolvimento front-end
 
O Papel do desenvolvedor Front End
O Papel do desenvolvedor Front EndO Papel do desenvolvedor Front End
O Papel do desenvolvedor Front End
 
Aula 1 linguagem html (1)
Aula 1   linguagem html (1)Aula 1   linguagem html (1)
Aula 1 linguagem html (1)
 
Evoluindo a arquitetura de uma aplicação com AngularJS
Evoluindo a arquitetura de uma aplicação com AngularJSEvoluindo a arquitetura de uma aplicação com AngularJS
Evoluindo a arquitetura de uma aplicação com AngularJS
 
AngularJS Abraçando o MVC Client-Side
AngularJS Abraçando o MVC Client-SideAngularJS Abraçando o MVC Client-Side
AngularJS Abraçando o MVC Client-Side
 
Criando uma arquitetura de front-end do zero
Criando uma arquitetura de front-end do zeroCriando uma arquitetura de front-end do zero
Criando uma arquitetura de front-end do zero
 
Estrutura de um Front-End eficiente (para iniciantes)
Estrutura de um Front-End eficiente (para iniciantes)Estrutura de um Front-End eficiente (para iniciantes)
Estrutura de um Front-End eficiente (para iniciantes)
 
Criando aplicações Single-Page com AngularJS
Criando aplicações Single-Page com AngularJSCriando aplicações Single-Page com AngularJS
Criando aplicações Single-Page com AngularJS
 

Semelhante a Front-end e back-end: entendendo como sites funcionam

Desenvolvimento web: PHP orientado a objetos
Desenvolvimento web: PHP orientado a objetosDesenvolvimento web: PHP orientado a objetos
Desenvolvimento web: PHP orientado a objetosLucas Vegi
 
PHP 5 de Forma Correta e Segura
PHP 5 de Forma Correta e SeguraPHP 5 de Forma Correta e Segura
PHP 5 de Forma Correta e SeguraKleber Silva
 
Oficina de PHP - Software Freedom Day Luziânia 2013
Oficina de PHP - Software Freedom Day Luziânia 2013Oficina de PHP - Software Freedom Day Luziânia 2013
Oficina de PHP - Software Freedom Day Luziânia 2013George Mendonça
 
Artigo de php
Artigo de phpArtigo de php
Artigo de phprobson
 
Aula 01 - Programação Web - PHP
Aula 01  - Programação Web - PHPAula 01  - Programação Web - PHP
Aula 01 - Programação Web - PHPDalton Martins
 
PHP, Presente e Futuro
PHP, Presente e FuturoPHP, Presente e Futuro
PHP, Presente e FuturoFreedom DayMS
 
PHP para aplicações Web de grande porte
PHP para aplicações Web  de grande portePHP para aplicações Web  de grande porte
PHP para aplicações Web de grande porteFelipe Ribeiro
 
DotNetDay novidades entityframework 4
DotNetDay novidades entityframework 4DotNetDay novidades entityframework 4
DotNetDay novidades entityframework 4Marcelo Paiva
 
A Evolução do PHP - 4º Dev In Santos
A Evolução do PHP - 4º Dev In SantosA Evolução do PHP - 4º Dev In Santos
A Evolução do PHP - 4º Dev In SantosEvaldo Junior
 
Prog web 01-php-introducao
Prog web 01-php-introducaoProg web 01-php-introducao
Prog web 01-php-introducaoRegis Magalhães
 

Semelhante a Front-end e back-end: entendendo como sites funcionam (20)

Desenvolvimento web: PHP orientado a objetos
Desenvolvimento web: PHP orientado a objetosDesenvolvimento web: PHP orientado a objetos
Desenvolvimento web: PHP orientado a objetos
 
PHP Moderno
PHP ModernoPHP Moderno
PHP Moderno
 
PHP 5 de Forma Correta e Segura
PHP 5 de Forma Correta e SeguraPHP 5 de Forma Correta e Segura
PHP 5 de Forma Correta e Segura
 
Oficina de PHP - Software Freedom Day Luziânia 2013
Oficina de PHP - Software Freedom Day Luziânia 2013Oficina de PHP - Software Freedom Day Luziânia 2013
Oficina de PHP - Software Freedom Day Luziânia 2013
 
Artigo de php
Artigo de phpArtigo de php
Artigo de php
 
Aula 01 - Programação Web - PHP
Aula 01  - Programação Web - PHPAula 01  - Programação Web - PHP
Aula 01 - Programação Web - PHP
 
Panorama PHP
Panorama PHPPanorama PHP
Panorama PHP
 
PHP: Evolução
PHP: EvoluçãoPHP: Evolução
PHP: Evolução
 
File3
File3File3
File3
 
File3
File3File3
File3
 
Mini Curso de PHP
Mini Curso de PHPMini Curso de PHP
Mini Curso de PHP
 
PHP, Presente e Futuro
PHP, Presente e FuturoPHP, Presente e Futuro
PHP, Presente e Futuro
 
PHP: Além do sitezinho
PHP: Além do sitezinhoPHP: Além do sitezinho
PHP: Além do sitezinho
 
PHP para aplicações Web de grande porte
PHP para aplicações Web  de grande portePHP para aplicações Web  de grande porte
PHP para aplicações Web de grande porte
 
DotNetDay novidades entityframework 4
DotNetDay novidades entityframework 4DotNetDay novidades entityframework 4
DotNetDay novidades entityframework 4
 
A Evolução do PHP - 4º Dev In Santos
A Evolução do PHP - 4º Dev In SantosA Evolução do PHP - 4º Dev In Santos
A Evolução do PHP - 4º Dev In Santos
 
PHP Presente e Futuro
PHP Presente e FuturoPHP Presente e Futuro
PHP Presente e Futuro
 
Apresentação faef
Apresentação faefApresentação faef
Apresentação faef
 
php 01 introducao
php 01 introducaophp 01 introducao
php 01 introducao
 
Prog web 01-php-introducao
Prog web 01-php-introducaoProg web 01-php-introducao
Prog web 01-php-introducao
 

Front-end e back-end: entendendo como sites funcionam

  • 1. Luiz Felipe F. M. Costa http://thenets.org/phelip Parte 1 - O poder das aplicações Web
  • 2. Meu nome é Luiz Felipe F. M. Costa.  Aluno de Sistemas de Informação na UNIFEI.  Estudo web front-end por conta.  Meu site: http://TheNets.org/  Meu email: phelip@thenets.org
  • 3. Você pode aprender os princípios nesse pouco tempo de aula, mas vai levar a vida toda se especializando.
  • 4. Não pretendo ensinar a fazer sites como o do Google ou do Facebook.  Objetivo  Entender como um site funciona.  Descobrir o poder das aplicações web.  Descobrir qual o caminho seguir para aprender a desenvolver para web.
  • 5. 1. Front-end e back-end. 2. O que é HTML5? 3. Instalando Apache+MySQL. 4. O que é PHP? 5. Criando meu próprio website. 6. Onde aprender? • Parte 1: de 1 a 2 • Parte 2: de 3 a 6
  • 6. P – Playgrounds  TecMundo  Chrome Experiments  Mozilla Demo Studio
  • 8. É processador no cliente  Interface gráfica  Exemplos de linguagens:  HTML  CSS  JS
  • 9. É processador no servidor  É seguro (para informações importantes)  Exemplos de linguagens:  PHP  Ruby on Rails  Python  ASP.NET  JSP
  • 10. 1991 HTML  1994 HTML2  1996 CSS1+JavaScript  1997 HTML4  1998 CSS2  2000 XHTML1  2002 Tableless Web Design  2005 Ajax  2009 HTML5
  • 11. HTML5 ~= HTML + CSS + JS  HTML5ROCKS: http://slides.html5rocks.com/#formula- intro-slide
  • 12. https://developer.mozilla.org/media/uploads/demos/b/o/boblemarin/5cfea13ba1397f6 96bea7b2ff62c0188/fluid_1339407870_demo_package/index.html
  • 13. xD com certeza!
  • 14. Grooveshark  Google+  Google Drive  Dropbox  AirDroid  SlideShare  Wordpress.org  Joomla
  • 15. Administrador dos projetos TheNets.org  Aluno de Sistemas de Informação na UNIFEI.  Meu site:  http://TheNets.org/  Meu email:  phelip@thenets.org  Meu twitter:  http://twitter.com/TheNets