Javascript descomplicado — Introdução

Olá pessoal, tudo bem?

Depois de muito tempo longe do Medium, resolvi voltar a publicar por aqui, pretendo iniciar uma série para ensinar a galera que quer aprender Javascript mas já teve contato com programação. Vou ensinar o “basicão” mesmo e tentar fazer com que os artigos sejam leves e rápidos pra não desanimar ok? Bom, chega de balela e vamos começar a conhecer essa belezinha que tem uma comunidade gigante e projetos incríveis que impactam a vida de todo o mundo, Bora!

O que é o Javascript?

O javascript é uma linguagem que permite a gente executar scripts interpretados a partir do cliente da nossa aplicação (que seria o nosso navegador). Quando estamos com o navegador aberto, o javascript consegue interagir com nosso browser sem que ele precise criar uma requisição no nosso servidor, para devolver uma respostas e ai sim tratar isso em tela.

Vou dar um exemplo simples para que você entenda melhor, imagine que você está em uma página, e clica em algum botão, ou link, e a página não recarrega, mas, algo diferente acontece na tela como aparecer um pop-up, janela ou algum símbolo se altera, Isso seria a execução no cliente (browser) sem que seja necessário ir até o servidor buscar uma resposta para fazer a mesma ação. Além disso com o javascript conseguimos alterar coisas na tela baseadas nas ações do nosso usuário, conseguimos monitorar quando ele passa o mouse em cima de alguma coisa, quando ele clica em algo, definir intervalos e por ai vai (se quiser ver todos os tipos de eventos que o javascript pode acompanhar pode ver aqui).

Reforçando, todas essas ações no lado do nosso cliente (browser) pois as nossas requisições não precisam chegar no lado do servidor para completar uma ação como alguma outra linguagem, como PHP, Phyton ou Ruby, que precisa receber essa ação no servidor e ela precisa responder pra assim alterar e executar a ação na tela. O javascript vai nos permitir fazer alterações na árvore de elemento em tela que chamamos de DOM (Document Object Model, você pode aprender mais sobre o que é o DOM aqui também).

Onde o Javascript é aplicado?

O Javascript é aplicado hoje em dia em todos os sites que você conhece como Youtube, Twitch, Facebook pois o javascript se tornou basicamente uma linguagem obrigatória para quem quer trabalhar com front-end. Hoje em dia criar uma aplicação front-end sem javascript é praticamente impossível.

A linguagem conseguiu evoluir muito, e hoje em dia consegue atuar também no back-end utilizando o Nodejs, não vou falar muito desse cara nesta série mas me deixa nos comentários se você quer aprender sobre ele também. Além de atuar no fron-end e no back-end, o Javascript ao lado da sua comunidade conseguiu evoluir junto ao Facebook e criar o React Native e com ele podemos criar aplicativos nativos para android e para iOS também, doido né?

Mas chega de “bla bla bla”, vamos pra mão da massa e vamos ver o Javascript em ação no próximo artigo ;)

1- Devise (Login)

Devise é uma solução flexível para autenticação para Rails, fácil pra caramba para instalar, Possibilidade de usar com múltiplos Models (para “users”, “admins” e mais o que você quiser), e totalmente Modular. Da uma olhada no repositório com toda documentação aqui.

2- Paperclip (Upload de arquivos)

Com o Paperclip você pode facilmente manipular arquivos (fotos, PDF e etcs). Para processar as imagens ele utiliza o ImageMagick assim você pode brincar a vontade com elas do jeito que bem entender. Da uma olhada no repositório aqui.

3- Rails Admin (Painel Administrativo)

Seu chefe/cliente precisa de um painel administrativo pra ontem? da uma olhada nessa Gem. Você consegue gerar em 15 minutos(ou menos) uma área administrativa para seu Webapp com CRUDS prontos para cada Model, busca(com filtros), Exportação de dados (CSV/JSON/XML) e mais uma pancada de coisas interessantes. Esse vídeo aqui (em inglês) mostra a instalação com login dessa Gem. Ah! o repositório aqui.

4-Rails-api (API)

Desenvolvida apenas para criação de API’s a Gem Rails-api é mais leve e não tem todas funcionalidades do Rails porque ela dá total atenção apenas no desenvolvimento da sua API. Da uma “fuçada” no repositório aqui e seja feliz. ;)

5- Will_paginate (Paginação)

Paginação fácil de utilizar e personalizar. Quer ver como é simples? um vídeo de 7 minutos pra você aprender a usar aqui. E depois corre para o repositório aqui.

Obs: Utilizar as Gems agiliza muito seu trabalho e elas realmente são fantásticas, mas você deve ter noção de como tudo funciona e saber como criar cada uma dessas funcionalidades na raça (não vá virar um programador “pipoqueiro” hein HAHA!). Até o próximo post :)

Estou levando em consideração que você já perdeu o medo da “telinha preta cheia de letras” (console) do Linux e tem uma fluência miníma nele. Mas se você não tem esse conhecimento da “Força” ainda esse Curso GRATUITO vai te ajudar (Vale a pena).

Agora chega de papo e mãos a obra!

Instalando Ruby

Pra começar abra seu querido console e vamos instalar as dependências para o Ruby (versão recomendada 2.2.3) com os comandos:

sudo apt-get update

Depois:

sudo apt-get install git-core curl zlib1g-dev build-essential libssl-dev libreadline-dev libyaml-dev libsqlite3-dev sqlite3 libxml2-dev libxslt1-dev libcurl4-openssl-dev python-software-properties libffi-dev

Obs: Não vou entrar em detalhes em quais dependências estão sendo instaladas para não alongar o post, mas você que está fazendo isso pela primeira vez deveria pesquisar o que significam todos essas dependências

Vamos continuar a instalar Ruby com Rbenv ( resumindo ele é um gerenciador de versões Ruby) então manda ver nos comandos

cd
git clone git://github.com/sstephenson/rbenv.git .rbenv

echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bashrc

echo 'eval "$(rbenv init -)"' >> ~/.bashrc

exec $SHELL

git clone git://github.com/sstephenson/ruby-build.git ~/.rbenv/plugins/ruby-build

echo 'export PATH="$HOME/.rbenv/plugins/ruby-build/bin:$PATH"' >> ~/.bashrc

exec $SHELL

git clone https://github.com/sstephenson/rbenv-gem-rehash.git ~/.rbenv/plugins/rbenv-gem-rehash

rbenv install 2.2.3

rbenv global 2.2.3

ruby -v

Agora nós dizemos as Rubygems (não sabe o que é? clica aqui e não tenha preguiça de ler :p) não instalar a documentação de cada pacote localmente e, em seguida, instalar o Bundler (O papel dele é gerenciar as dependências das Gems).

echo "gem: --no-ri --no-rdoc" > ~/.gemrc
gem install bundler

Pronto! nem doeu né?

Instalando Rails

Desde que o Rails começou a enviar várias dependências, nós vamos precisar instalar o NodeJS ❤

Para instalar o NodeJS

sudo add-apt-repository ppa:chris-lea/node.js
sudo apt-get update
sudo apt-get install nodejs

Agora o nosso querido Rails

gem install rails -v 4.2.4

E para deixar o Rails executável (já que usamos o rbenv)

rbenv rehash

Para testar e ver se sua instalação foi feita com sucesso rode o comando

rails -v
# Rails 4.2.4

Obs: se você teve o resultado “# Rails 4.2.4” tudo deu certo :)

Banco de dados com Rails

O Rails por padrão utiliza como banco de dados Sqlite3 mas vamos usar algo mais robusto como o MySQL ou PostgreSQL (não precisa instalar os dois, a não ser que você queira testar os dois, meu conselho é começar pelo MySQL se você ta começando e depois ir para o PostgreSQL).

Obs: No final do artigo vou ensinar a usar o MySQL ou PostgreSQL na hora de gerar a estrutura da sua aplicação Rails. Quando você criar sua primeira aplicação Rails, você deve modificar o arquivo “database.yml” com as informações de conexão com seu banco de dados que já deve estar criado.

Instalando MySQL

Rode o comando:

sudo apt-get install mysql-server mysql-client libmysqlclient-dev

Instalando PostgreSQL

Rode os comandos:

sudo sh -c "echo 'deb http://apt.postgresql.org/pub/repos/apt/ precise-pgdg main' > /etc/apt/sources.list.d/pgdg.list"
wget --quiet -O - http://apt.postgresql.org/pub/repos/apt/ACCC4CF8.asc | sudo apt-key add -
sudo apt-get update
sudo apt-get install postgresql-common
sudo apt-get install postgresql-9.3 libpq-dev

E para criar um usuário pra você já que ainda não fizemos isso:

sudo -u postgres createuser meuusuario -s

# If you would like to set a password for the user, you can do the following
sudo -u postgres psql
postgres=# \password minhasenha

Últimos passos

Agora que tudo ta bonito rodando, vamos pra hora da verdade e criar sua primeira aplicação Rails:

#### Se quiser utilizar o SQLite (não é recomendado)
rails new myapp

#### Se você quiser utilizar o MySQL
rails new myapp -d mysql

#### Se você quiser utilizar o PostgreSQL (ele vai pedir seu login do PostgreSQL)
rails new myapp -d postgresql

# Entrando no diretório da sua aplicação
cd myapp

# Se você escolheu utilizar o MySQL ou PostgreSQL vá até o arquivo config/database.yml e insira seu username/password específico

# Criar seu bando de dados
rake db:create

# Iniciar seu servidor Rails
rails server

Agora no seu navegador depois de iniciar o servidor Rails insira para http://localhost:3000 para ver o Rails rodando.

Pronto!