1. Introdução ao Linux
  2. Introdução ao Git
  3. HTML e CSS básico
  4. Noções de JavaScript e jQuery
  5. Introdução ao Vim
  6. Lógica de Programação
  7. Introdução ao Python
  8. Introdução ao PostgreSQL

Introdução ao Linux

Material do Rafael

pwd
mkdir
ls
rm
cp
echo
cat
man

Grande portal Shell Script 1 - O Básico

mkdir -p fs2w/essential_mix
tree fs2w
mkdir -p pasta/subpasta
rm -rf pasta/subpasta

Cuidado com os comandos perigosos do Shell!!!

$ cat << EOF > essential.txt
FS2W Essential Mix
EOF
$ cat essential.txt
$ source setup.sh

setup.sh

Introdução ao Git

Material do Samuka

"Git não é GitHub"

Existem outros:

git clone <url>
git status
git add <arquivo>
git status
git commit -m <mensagem>
git push origin master



git pull
git checkout -b gh-pages
git add index.html
git commit -m "website v1"
git push origin gh-pages

HTML e CSS básico

Material do Amir

Vários links:

layoutit.com

startbootstrap.com

pexels.com

Escolha um editor de texto e use o plugin Emmet.

Head básico

link

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="shortcut icon" href="http://html5-training-in-hyderabad.blogspot.com.br/favicon.ico">
  <title>FS2W</title>
  <!-- Bootstrap core CSS -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <!-- Font-awesome -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  <!-- jQuery -->
  <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
  <!-- Bootstrap core JS -->
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
  
</body>
</html>

meu exemplo

ex1

ex2

ex2

usar layoutit.com

Noções de JavaScript e jQuery

Material da Camila

jsfiddle.net

var name = 'Regis';
let car = {color: 'blue'};
console.log(name);
console.log(car);



for (let i = 0; i <= 10; i++) {
  console.log(i);
}
var i = 1;                     //  set your counter to 1

function myLoop () {           //  create a loop function
   setTimeout(function () {    //  call a 3s setTimeout when the loop is called
      console.log(i);          //  your code here
      i++;                     //  increment the counter
      if (i <= 10) {            //  if the counter < 10, call the loop function
         myLoop();             //  ..  again which will trigger another 
      }                        //  ..  setTimeout()
   }, 500)
}

myLoop();

Rodar servidor http

$ python3 -m http.server 8080

spa.html

ex

JSON

ex3

[
    {
        "name": "Regis Santos",
        "e-mail": "regis@example.com"
    },
    {
        "name": "Rafael Henrique",
        "e-mail": "rafael@example.com"
    },
    {
        "name": "Isabel Silva",
        "e-mail": "isabel@example.com"
    }
]

JavaScript

ex4

<script>
  $(document).ready(function() {
    $.getJSON('names.json', function(data) {
      if (data.length == 0) {
        $('#list_contact').append(
          '<p class="lead alert alert-warning">Não existem itens na lista.</p>'
        );
      } else {
        for (var i = 0; i < data.length; i++) {
          $('#list_contact').append(
            '<div class="list-group-item">' +
            '<span class="js-delete-contact pull-right"><i class="fa fa-lg fa-times"></i></span>' +
            '<p><b>Nome:</b> ' + data[i]['name'] + '</p>' +
            '<p><b>e-mail:</b> ' + data[i]['e-mail'] + '</p>' +
            '</div>'
          );
        }
      }
    });
  });
</script>

Modal

ex5

<!-- Add Contact Modal -->
<div class="modal fade" id="add_contact_modal" aria-labelledby="addContactModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                 
                <button id="dismiss_contact_close" type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
                <h4 class="modal-title" id="addContactModalLabel">
                    Novo Contato
                </h4>
            </div>
            <form id="add_contact_form" action="." method="POST">
              <div class="modal-body">
                <div class="form-group">
                  <label class="control-label" for="id_name">Nome</label>
                  <input type="text" name="name" id="id_name" class="form-control" />
                </div>
                <div class="form-group">
                  <label class="control-label" for="id_email">E-mail</label>
                  <input type="email" name="email" id="id_email" class="form-control" />
                </div>
              </div>
              <div class="modal-footer">
                   
                  <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
                  <button type="submit" class="btn btn-primary">Salvar</button>
              </div>
            </form>
        </div> <!-- modal-content -->
        
    </div> <!-- modal-dialog -->
    
</div> <!-- end modal -->

Mais JS

ex6

$('#add_contact_form').on('submit', function(e) {
  e.preventDefault();
  add_contact_post();
});

function add_contact_post() {
  // Pega os valores dos campos name e email
  let name = $('#id_name').val();
  let email = $('#id_email').val();
  // Remove os valores dos inputs
  $('#add_contact_form')[0].reset();
  // Fecha o form
  $('#dismiss_contact_close').click();
  // Adiciona o novo contato na lista
  $('#list_contact').prepend(
    '<div class="list-group-item">' +
    '<span id="delete_contact" class="js-delete-contact pull-right"' + '" data-target="#del_contact_modal" data-toggle="modal"><i class="fa fa-lg fa-times"></i></span>' +
    '<span id="edit_contact" class="pull-right"><i class="fa fa-lg fa-pencil-square-o"></i></span>' +
    '<p><b>Nome:</b> ' + name + '</p>' +
    '<p><b>e-mail:</b> ' + email + '</p>' +
    '</div>'
  )
}

Deletando os itens

$('.js-delete-contact').click(function(e) {
  e.preventDefault();
  $(this).parent().remove();
});

Deletando os itens

$(document).on('click', '.js-delete-contact', function(e) {
  e.preventDefault();
  $(this).parent().remove();
});
$(document).on('click', '.js-delete-contact', function(e) {
  e.preventDefault();
  $(this).parent().remove();
});
$('.js-delete-contact').click(function(e) {
  e.preventDefault();
  $(this).parent().remove();
});

https://stackoverflow.com/a/12055498

Introdução ao Vim

Não tem material :(

Grupylango - Vim - mais que um editor - com Magun Leno

Grande Portal - Vim

Lógica de Programação

Material do Paulo Romano

Introdução ao Python

Material das PyLadies

>>> names = ('Regis Rafael Samuel Amir Camila Juliano').split()
>>> names

Nota final de provas

ex

import unittest


def nota(valor):
    if valor >= 7:
        return 'Aprovado'
    elif valor >= 4:
        return 'Recuperação'
    else:
        return 'Reprovado'
class GradeTest(unittest.TestCase):

    def test_grade(self):
        self.assertEqual(nota(10), 'Aprovado')
        self.assertEqual(nota(7), 'Aprovado')
        self.assertEqual(nota(6.9), 'Recuperação')
        self.assertEqual(nota(4), 'Recuperação')
        self.assertEqual(nota(3.9), 'Reprovado')
        self.assertEqual(nota(0), 'Reprovado')

def main():
    alunos = {
        'Regis': 1,
        'Renata': 10,
        'Samanta': 10,
        'Karina': 6.9,
        'João': 4,
        'Pedrinho': 0,
    }
    for aluno, valor in alunos.items():
        print(aluno, valor, nota(valor))

if __name__ == '__main__':
    main()
    unittest.main()

Introdução ao PostgreSQL

Material do Juliano

Gerenciando Sqlite3 com Python

CREATE TABLE tb_person(
    id INTEGER PRIMARY KEY AUTOINCREMENT,
    name varchar(50),
    email varchar(50)
);

INSERT INTO tb_person(name, email)
VALUES ('Regis', 'regis@email.com');
INSERT INTO tb_person(name, email) VALUES
('Rafael', 'rafael@email.com'),
('Camila', 'camila@email.com'),
('Juliano', 'juliano@email.com');
SELECT * FROM tb_person;

#FS2W

@grupy-sp             @grupysaopaulo

12/08/17 GruPy-SP Day Locaweb

15/08/17 Coding Dojo na Purple99

19/08/17 FS2W #10 Flask

Made with Slides.com