ferramentas livres para desenvolvimento web

Programa

• Um pouco de História• Etapas do Desenvolvimento– Coleta de Informações– Planejamento– Design– Desenvolvimento– Testes e Publicação– Manutenção

• Considerações finais

A Web foi criado em 1989, por Tim Berners-Lee, para ser um padrão de publicação e distribuição de textos científicos e acadêmicos.

Localizador Uniforme de Recursos (URL)Linguagem de Marcação de Hipertexto (HTML)

Protocolo de Transferência de Hipertexto (HTTP)Navegador Web (Browser)

Como tudo começou...

http://pt.wikipedia.org/wiki/Tim_Berners-Lee

Também conhecida como World-Wide Web (WWW) é a parte multimídia da Internet, portanto possibilita a exibição de páginas de hipertexto, ou seja, texto em formato digital, documentos que podem conter todo o tipo de informação: textos, fotos, animações, trechos de vídeo e sons e programas e que permite conexões entre documentos (os links).

A Web

W3C (World Wide Web Consortium) é um consórcio de empresas de tecnologia. Fundado por Tim Berners-Lee em 1994 para levar a Web ao seu potencial máximo.

Desenvolve Recomendações abertas,até agora mais de 80 padrões...

www.w3.org

O que é W3C?

http://www.w3.org/

Padrões Web ou Web Standards são um conjunto de normas, diretrizes, recomendações, notas, artigos, tutoriais e afins de caráter técnico, produzidos pelo W3C e destinados a orientar fabricantes, desenvolvedores e projetistas para o uso de práticas que possibilitem a criação de uma Web acessível a todos, independentemente dos dispositivos usados ou de suas necessidades especiais.

XHTML – HTML – CSS – DOM – XML – SVG – SOAP – ...

Os Padrões Web

Programa



Mapa do Site

• É uma representação hierárquica da estrutura de um site, composta por páginas web.

• O "mapa do site" é feito com os tópicos mais importantes e seus sub-tópicos, se tiver. Ele é um índice para um fácil entendimento da navegação do projeto.

http://writemaps.com

Wireframe

• Wireframe seria um esqueleto do site, que deve ser feito antes de iniciar a montagem do layout com cores e imagens.

https://gomockingbird.com/

Programa



http://www.gimp.org/

Programa



HTML

HTML é a abreviação para HyperText Markup Language, que pode ser traduzido como Linguagem de Marcação para Hipertexto.Compõe a estrutura de uma página Web através de etiquetas (tags) e atributos.

CSS

Cascading Style Sheets (ou simplesmente CSS) é uma linguagem de estilo utilizada para definir a apresentação de documentos escritos em uma linguagem de marcação, como HTML ou XML.

Seu principal benefício é prover a separação entre o formato e o conteúdo de um documento.

Pode-se definir apresentações especificas para diferentes dispositivos (Tvs, Celulares e PDAs, Impressoras, etc) apenas criandofolhas de estilo alternativas.

JavaScript

JavaScript é uma linguagem de programação criada por Brendan Eich em 1995.

A linguagem foi criada para atender, principalmente, às seguintes necessidades:

* Validação de formulários no lado cliente; * Interação com a página (Comportamento).

JQuery

Jquery que é uma biblioteca JavaScript criada por John Resig que tem por finalidade facilitar o desenvolvimento de scripts.A biblioteca jQuery é disponibilizada como software livre( pode ser usada, copiada, estudada, modificada e redistribuída sem restrição), ou seja, você pode usar a biblioteca gratuitamente tanto para desenvolver seus projetos pessoais e comerciais.

http://www.jquery.com

http://jquery.com/

http://www.jquery.com/

PHP

É uma linguagem que permite criar sites dinâmicos, possibilitando uma interação com o usuário através de formulários, parâmetros da URL e links. A diferença de PHP com relação a linguagens semelhantes a Javascript é que o código PHP é executado no servidor, sendo enviado para o cliente apenas html puro. Desta maneira é possível interagir com bancos de dados e aplicações existentes no servidor.

http://www.php.net

http://www.php.net/

MYSQL

O MySQL é um sistema de gerenciamento de banco de dados (SGBD), que utiliza a linguagem SQL (Linguagem de Consulta Estruturada, do inglês Structured Query Language) como interface. É atualmente um dos bancos de dados mais populares, com mais de 10 milhões de instalações pelo mundo.

http://www.mysql.com

http://www.mysql.com/

PhpMyAdmin

http://www.phpmyadmin.net

http://www.phpmyadmin.net/

XAMPP

Com o XAMPP é fácil instalar a distribuição Apache contendo PHP, MySQL e Perl. O XAMPP é realmente muito fácil instalar e usar – é necessário apenas baixar, extrair e inicializar.

http://www.apachefriends.org/pt_br/xampp.html

http://www.apachefriends.org/pt_br/xampp.html

Aptana

Aptana ou Aptana Studio é um software open source para IDE (Integrated Development Environment) desenvolvido em Java que suporta as linguagens CSS, HTML e JavaScript, embora também seja possível configurá-lo para suportar PHP, Ruby on Rails, Adobe® AIR e Bibliotecas AJAX. É baseado no Eclipse.

http://www.aptana.com/

Programa



http://br.mozdev.org/download/

http://www.google.com.br/chrome

FTP: O que é?

• FTP significa File Transfer Protocol (Protocolo de Transferência de Arquivos), e é uma forma bastante rápida e versátil de transferir arquivos, sendo uma das mais usadas na internet.

http://filezilla-project.org/

Programa



CMS: WordPress

• Criado por Matt Mullenweg, roda em PHP e MySQL sob a licença GPL

• Tem como foco padrões de usabilidade e facilidades para o usuário final

• É largamente utilizado como um CMS apesar de ainda não ser um

• Como todo software livre tem uma comunidade grande e ativa

• Plataforma utilizada em grandes projetos nacionais e internacionais

CMS: WordPress

http://br.wordpress.org

http://br.wordpress.org/

CMS: WordPress

• Fazer o download do pacote em:http://br.wordpress.org

• Conseguir um servidor PHP!• Conseguir um banco de dados MYSQL!• Mandar os arquivos pro servidor PHP!• Criar o banco de dados!• Acessar o endereço para iniciar a instalação.

http://br.wordpress.org/

Programa



Por onde continuar?

http://tools.mozilla.com/

http://tools.mozilla.com/

Obrigado! ;)

ferramentas livres para desenvolvimento web

Education