andersonarcenio.com

Este primeiro módulo tem como intuito apenas apresentar a linguagem de marcação XHTML, para quem ainda não a conhece.

Você irá perceber durante o decorrer do tutorial que, XHTML não é muito diferente do HTML 4.01, trata-se apenas de uma reformulação, mas que mantêm aspectos praticamente idênticos, portanto, se você já desenvolve seus códigos respeitando os padrões do HTML 4.01 é um bom início.

Veja a referência completa do HTML 4.01 .

XHTML ou EXtensible HyperText Markup Language ou ainda Linguagem EXtensível para Marcação de HiperTexto, em resumo, trata-se de um HTML mais rigoroso, no sentido de ser bem-formatado, claro e limpo.

Tem como origem a combinação do XML (projetado para descrever dados) e do HTML (criado para exibir dados).

Hoje o mercado é constituído de diferentes navegadores, cada um com sua tecnologia. Alguns destes são para uso em computadores, outros são executados em dispositivos móveis, sendo que estes últimos por sua vez não possuem os recursos ou poder de interpretar uma “má” linguagem de marcação.

Com isso, XHTML tornou-se uma recomendação da W3C em 26 de janeiro de 2000, e hoje todos os novos navegadores possuem suporte e compatibilidade à ela.

Trata-se de um padrão web, portanto, você é ou quer ser um desenvolvedor nesta área? Então utilize-o!

O tutorial será desenvolvido considerando que você já tenha uma noção de HTML, caso ainda não a tenha, você pode adquiri-la aqui ou aqui.

Acredito que tratando de assuntos desta área, ver só a teoria não é suficiente, por isso vou propor que façamos algo na prática.

Que tal fazermos uma página para exibição de notícias? Sendo que estas notícias serão cadastradas através de uma área administrativa somente acessada por um login e senha válidos. Pode ser? Feito então!

Durante o tutorial de XHTML criaremos as telas, e seguindo a proposta, durante o tutorial de PHP / MySQL daremos vida a estas telas, tornando-as dinâmicas e fazendo este mini-sistema de notícias funcionar.

O tutorial de XHTML será dividido em 4 módulos:

• Introdução: O que é, Porque usar..
• Principais mudanças: Sintaxe, DOCTYPE, Diferenças em relação ao HTML..
• Desenvolvimento: Criação das telas que serão utilizadas no mini-sistema..
• Validação: Demonstrando como validar o código..

Proposta feita, tutorial explicado, semana que vem daremos início.

Esta semana vou começar uma nova proposta para este Blog, e que promete durar por várias outras semanas. Andei pesquisando um pouco por curiosidade, e reparei que não temos grandes mini-cursos ou tutoriais ( claro, existem exceções e irei citar algumas delas aqui ) para assuntos de desenvolvimento web ( para iniciantes ).

Considerando que já tenho alguma experiência na área, acredito que consiga desenvolver um material bacana, que possa ser útil para algumas pessoas.

Então esta é a nova proposta, desenvolver tutoriais, que serão divididos em Módulos, abordando os assuntos, XHTML e  PHP / MySQL, nesta mesma ordem.

A frequência de atualização pretendo que seja de um novo Módulo por semana.

Começando por hoje, aguardem!

É isso, mais um ano acabando, e mais um ano meu querido tricolor sendo campeão brasileiro, hexa-campeão, tri-campeão consecutivo, bom demais!

A diretoria tem lançado camisetas comemorativas contendo o número de títulos correspondentes aos campeonatos Brasileiro - Libertadores - Mundial, o famoso 6 - 3 - 3.

O problema é que estes números tem mudado a cada ano, fica complicado para os torcedores manterem suas camisetas atualizadas, baseado nisso, vi uma brincadeira de torcedores falando que estas camisetas deveriam ter o número descartável, ou seja, que pudessemos mudar a cada ano.

Foi daí que resolvi gastar umas 3 horinhas do meu tempo para fazer, considerando meu lado desenvolvedor / geek / nerd de ser, esta pequena aplicação, em que o usuário digita o ano, e são preenchidos os números nas camisetas, considerando quantos títulos o time possuia na época.

Quiserem ver esta brincadeira, sem grande utilidade:
http://www.andersonarcenio.com/saopaulo

Restanto apenas uma semana para o esperado iMasters InterCon 2008, evento que acontecerá em São Paulo e contará com 4 eventos simultâneos ( além das palestras principais, acontecerá a FF’08 com palestras rápidas, e mais duas oficinas técnicas ), contando com a presença de mais de 700 pessoas e 24 palestrantes, discutindo e abordando assuntos relacionados com inovação digital e desenvolvimento da web.

Se interessou? Infelizmente é tarde, pois as inscrições esgotaram-se com praticamente 1 mês de antecedência. Mas se quiser saber mais sobre o que vai acontecer por lá, o site do evento é: http://imasters.uol.com.br/intercon/2008/

Bom, considerando que grande parte das pessoas que lá estarão, utilizam o twitter, eu mais Fernando Cordeiro, resolvemos fazer um mashup juntando ambos: a ferramenta de microblogging e o evento.

TwinterCon é um lugar onde estará concentrado todas mensagens enviadas pelo Twitter que falam sobre o InterCon, e mais que isso, já que isso outros sites já fazem essa função, como o próprio título já diz: “Twitte, cresça e apareça”, quanto mais mensagens você enviar, mais sua foto irá aumentar, e assim você ficará mais visível e destacado aos visitantes do site.

Infelizmente nossa rotina diária, não nos permitiu fazer tudo que queriamos, mas vale a pena dar uma olhada no resultado final.

http://www.andersonarcenio.com/twintercon/

Easter Egg, para quem não sabe, é  o termo adotado para descrever as “surpresas” escondidas em músicas, jogos, livros, álbuns, sites, softwares e afins. Dentre estas diversas áreas existem vários bem interessantes, alguns destes, até polêmicos, mas como o foco do post não é este, dêem uma pesquisada que vale a pena.

Falando-se em web, é possível fazer estas brincadeiras, com simples tratamentos de eventos, seja eles de mouse ou de teclado, em Javascript.

Para quem se interessar, tem um artigo no htmlgoodies que fala um pouco melhor deles, mas especificamente de eventos de Key.

Pra finalizar, o assunto merecia, algo na prática, não acham ? Pois bem, o primeiro que descobrir o easter egg que criei aqui, ganha uma Cerveja!

Dica: É quase o mesmo easter egg do Goggle Reader, mas adaptado para o modo de um dos jogos mais famosos de Tiro.

Tive necessidade em certas situações de saber quantos caracteres possuia um texto, e como não conhecia nenhuma ferramenta que fazia isso, acabava improvisando, estimando essa quantidade ( porque obviamente não ia contar caracter a caracter né? ).

Então resolvi criar uma aplicação simples, que faz isso pra mim. Que mostra a quantidade de caracteres do texto, a quantidade de caracteres sem espaços em branco e a quantidade sem tags HTML e/ou PHP.

Foi feita em php, caso alguém necessite do código de algo assim, só me falar, que disponibilizo.

Ela está em:
http://www.andersonarcenio.com/contador_caracteres

Vou postar aqui uma funçãozinha em javascript que utilizei em um projeto que vinha desenvolvendo para faculdade, cujo exibe o mapa correspondente ao endereço recebido como argumento.

Aproveitando a deixa, o projeto trata-se de uma Agenda ( virtual / web , como desejarem ). O intuito era acoplar em um local, todas funções que uma agenda, daquelas tradicionais lembra? podem exercitar. Nesta versão, ainda em fase Beta, ela contém uma Agenda de Contatos, que é o foco do projeto, onde você registra seus contatos, contém funcionalidades como exibição destes através do Google Maps, envio de SMS para celulares Claro, dentre outras coisas. Além de uma Agenda de Compromissos, no estilo Google Calendar ( sem querer competir com eles, obviamente ), e uma Agenda de Anotações.

Quem quiser conferir:
www.andersonarcenio.com/yias

Enfim, vamos a função:

<script type=”text/javascript”>

//<![CDATA[

var map = null;
var geocoder = null;

function showAddress(address) {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
geocoder = new GClientGeocoder();
if (geocoder) {
geocoder.getLatLng(
address,
function(point) {
if (!point) {
alert(address + " - não encontrado no Google Maps.");
} else {
map.setCenter(point, 13);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml(address);
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
}
}
);
}
}
}

//]]>

</script>

Essa função recebe como argumento o endereço, o mesmo que você digitaria na página do Maps.

O mapa referente ao endereço recebido, aparecerá em uma div, por exemplo, em alguma tag que tenha id =’map_canvas’.

Não vou especificar detalhes da função, caso alguém se interessar, é só comentar, que responderei com prazer!

á ouviu falar de um sistema operacional web ? Eu até certo tempo atrás não, quando escutei à respeito, pesquisei e vi que existem vários exemplos já implementados disto.

O site da info faz uma análise de 4 modelos. Tentei testar estes modelos, porém consegui realmente testar e de forma fácil, somente um deles, e talvez por esse fato, aliado à algumas outras coisas que percebi, acredito que ele merecia uma melhor avaliação do que a revista InfoExame fez.

O eyeOS é uma plataforma Open Source concebida para armazenar uma grande variedade de Web Aplicações sobre ele. O eyeOS foi pensado como uma nova definição de Sistema Operacional, onde tudo dentro dele pode ser acessado a partir de qualquer lugar de uma rede. Tudo o que você precisa fazer é login no seu servidor com um Browser de Internet  comum, e assim aceder ao seu computador pessoal, com as suas aplicações, documentos, música, filmes … Tal como você os deixou da última vez.

Atualmente, com o sistema básico, você pode encontrar um pacote completo de aplicações, algumas para uso privado, como o gerenciador de arquivos, um processador de texto, uma
agenda, contactos ou um bloco de notas. Existem também algumas aplicações para utilizar em grupo, tais como um gestor de grupos, uma aplicação de partilha de arquivos, Um mensageiro de grupo e muitos mais.

O eyeOS é Open Source, licenciado sob a GNU Public License versão 3 (GPL3), o que significa que você pode ter o seu próprio servidor privado eyeOS para a sua família e amigos, empresa ou rede de Internet, de forma totalmente gratuita. Mas isso também significa que você
pode navegar através do código fonte eyeOS e assim desenvolver para o eyeOS ferramentas para personalizar o sistema e desenvolver novas aplicações que se encaixem nas suas necessidades específicas.

Fonte: eyesOS.org

Lógico, ele não subtituirá seu tradicional sistema operacional ( quem sabe um dia.. ), até porque para utilizá-lo, você necessitará de um com um Browser instalado.

Mas ele é uma ferramenta bem interessante, se você necessita agrupar várias aplicações web, e com isso poder acessá-las de qualquer lugar.

Pode ser instalado em qualquer máquina, basta para isto que você tenha um servidor web rodando e uma versão do PHP 5 ou superior (Instalação extremamente fácil).  Além de poder ser acessado diretamente no site do desenvolvedor, criando um usuário, ou acessando com um usuário demo para apenas ver como é.

É possível ainda instalar outras aplicações que são desenvolvidos por uma comunidade, de forma bastante prática também. Enfim, vale a pena dar uma olhada, é no mínimo interessante.

Links:

Demonstração ( Usuário DEMO :-O   , para testar)
Novas Aplicações para instalar nele.

Já ouviu falar do meadiciona.com ? e do mysuperyes.com ? Não? O intuito é esse, demonstrá-los ..

meadiciona.com

Trata-se de uma ferramenta simples porém interessante, que dependendo da forma que você se relaciona com outros contatos, pode ser bem útil. Provavelmente você já passou por situações do tipo:

- precisar soletrar o seu MSN para algum amigo lhe adicionar.

- ou como no próprio site cita: “Você tem o Orkut do Fulano? Aquele, amigo da Ciclana. Então, procura ele, vai nos amigos e procure pelo meu nome, João da Silva. ” É bom procurar mesmo, pois existem mais de 500 pessoas com este nome.

A idéia deste site é centralizar todas suas formas de contato. Ou seja, você registra o serviço que você utiliza ( atualmente tem suporte à mais de 70, como MSN, Skype, Orkut, Facebook.. ), e todos ficam localizados em um único local , sendo este local algo como: meadiciona.com/seunome .

Não fica bem mais fácil assim? Falando este endereço, a pessoa que entrar lá terá acesso a todos os serviços que você utiliza e assim poderá entrar em contato com você.

Se quiserem me adicionar ou simplesmente ver como funciona:
http://meadiciona.com/andersonarcenio

www.mysuperyes.com

Este não tem muita utilidade, mas é “legalzinho”.

Você já quis possuir seu próprio mecanismo de busca ? Sim ?

Este serviço permite que você crie mecanismos de busca pesonalizados com seu nome no logo. Tendo várias opções de personalização.

Exemplo:
www.mysuperyes.com/google/Black/andersonarcenio.php