$30 off During Our Annual Pro Sale. View Details »

Rails Girls Sofia 4.0 March 2015 - Day 2

Rails Girls Sofia 4.0 March 2015 - Day 2

Slides for the Rails Girls Sofia 4.0 event, which took place on 6-7 March 2015. Day two.

Dimitar Dimitrov

March 07, 2015
Tweet

More Decks by Dimitar Dimitrov

Other Decks in Education

Transcript

  1. Rails Girls Sofia 4.0
    Ден 1
    6-7 март 2015 г.

    View Slide

  2. Здравейте!
    (отново)

    View Slide

  3. Вчера

    View Slide

  4. View Slide

  5. View Slide

  6. Днес

    View Slide

  7. View Slide

  8. View Slide

  9. View Slide

  10. Цел

    View Slide

  11. Да сглобим нещо!

    View Slide

  12. Да запалим > Да научим

    View Slide

  13. Как?

    View Slide

  14. Не бързайте; има време.
    Задавайте въпроси. Много.
    Обяснявайте си неща взаимно.
    Бъдете максимално непредубедени.
    Забавлявайте се :)

    View Slide

  15. Бележки?
    • Слайдовете и от двата дни ще са качени на
    сайта
    • Ще ви засипем с линкове и напътствия след
    края на събитието – тях няма нужда да
    помните
    • Записвайте си въпроси, неясни термини,
    неща за обяснение по-късно, интересни
    моменти
    • Винаги може да питате инструктора си или
    нас за нещо

    View Slide

  16. Термини
    • Ще има много, които няма да знаете.
    • Питайте за всички. Трябва ви само груба
    представа кое какво е. Не е нужно да
    помните всичко.
    • Понякога не се усещаме, когато ползваме
    термини. Помогнете ни.

    View Slide

  17. Кодекс на поведение
    http://railsgirls.com/sofia#code-of-conduct

    View Slide

  18. View Slide

  19. Процедурни
    • Hashtag — #RailsGirlsSofia
    • Facebook страница и Facebook група —
    “RailsGirlsSofia”
    • Обяд тук, от спонсорите, в 13:00 ч.
    • Кафе-пауза в 15:45 ч.
    • Афтърпарти от 20 ч. в Ink Bar, на ул.
    Славянска 36, всички са поканени!
    • Имате по едно безплатно питие от нас

    View Slide

  20. План

    View Slide

  21. 1. Блиц-увод в програмирането и уеб
    приложенията
    2. Уъркшоп 1 (TryRuby.org)
    3. Обяд
    4. Бентобокс игра
    5. Няколко петминутни презентации
    6. Уъркшоп 2
    7. ПАРТИ!

    View Slide

  22. Що е то
    програмиране?

    View Slide

  23. https://twitter.com/fjsteele/status/434249935316615168

    View Slide

  24. View Slide

  25. Ruby?

    View Slide

  26. View Slide

  27. Език за програмиране

    View Slide

  28. Език за програмиране
    =
    Купчина правила, с
    които управлявате
    компютър

    View Slide

  29. Сходно на естествените
    езици, но с (доста)
    по-стриктни правила.

    View Slide

  30. Не е трудно да се
    научите.

    View Slide

  31. Езици за програмиране
    • Ruby (Руби) е език за програмиране
    • Има и други (C#, Java, C++, PHP, JavaScript,
    Clojure, Scheme и още 2783...)
    • Можем да ползваме произволен* език, за
    да правим това, което ще правим днес
    • Руби е готин и ще ползваме него
    • Може да си изкарвате прехраната с Ruby :)

    View Slide

  32. Нещата, които ще
    научите, важат и за
    други езици.

    View Slide

  33. Show me the code!

    View Slide

  34. Ето ви малко Ruby*
    5.пъти  {  
       покажи_текст_на_екрана  "Здравейте!"  
    }

    View Slide

  35. Внимание - термини
    • Код = последователност от команди и данни
    • Кодът на Ruby (а и повечето други езици за
    програмиране) се пази в текстови файлове
    • Изпълнява се от програма (интерпретатор),
    кръстена “ruby”
    • Може да си играете с Ruby и в т.нар.
    “интерактивна конзола” (REPL)
    • Interactive Ruby — irb и TryRuby.org

    View Slide

  36. Основи на
    програмирането
    1. Данни
    2. Имена
    3. Действия
    4. Условия
    5. Цикли
    6. Изрази

    View Slide

  37. 1. Данни
    • Всичко се върти около данните –
    зареждате данни, манипулирате данни,
    продуцидате данни.
    • Програмиране = зареждане на данни,
    манипулация на данни, продуциране на
    данни (по автоматизиран начин)

    View Slide

  38. 1. Данни – зареждане
    1. “Зареждане” на данни – прочитане от
    файлове, вход от потребителя, прочитане
    от друга програма (база данни, интернет и
    т.н.)
    2. Вмъкване на данните в самата програма

    View Slide

  39. 1. Данни – типове
    1. Текст – без ограничение в дължината
    2. Числа – цели, с плаваща запетая,
    рационални, комплексни
    3. Съставни типове данни – списъци от неща,
    речници с неща
    4. Наши собствени типове данни –
    “продукт”, “поръчка”, “потребител”, …

    View Slide

  40. 2. Имена
    1. Механизъм да реферираме към
    определени данни
    2. Името си го избираме ние и го
    “насочваме” към някакви данни
    3. Може да сменяме накъде сочи името
    4. Правим манипулации с името, реално
    работейки с данните зад него
    5. Наричаме ги променливи (variables)

    View Slide

  41. 2. Имена
    Имена (променливи) и данни (стойности):
    някакво_име  =  данни  
    Например:
    event_name  =  "Rails  Girls  Sofia  4.0"

    candidates  =  "many"  
    accepted_participants  =  25  *  2

    View Slide

  42. 3. Действия
    Всички данни (стойности) поддържат
    определени операции/действия:
       
    данни.действие  
    данни.друго_действие()  
    данни.пак_действие(други_данни)  
    данни.друго_действие(и,  разни,  опции)

    View Slide

  43. 3. Действия
    Например:
       
    “Радостина”.length  
    6  *  7  
    Date.today  
    participants.first(5)

    View Slide

  44. 3. Действия
    Например:
       
    “Радостина”.length()  
    6.*(7)  
    Date.today()  
    participants.first(5)

    View Slide

  45. 3. Действия
    Шаблонът е:
       
    данни.име_на_действие(опции)

    View Slide

  46. Обекти?
    1. Обекти = данни + операциите, които
    можем да правим с тях.
    2. Днес ще приемем, че “данни” и “обекти”
    са взаимозаменяеми.

    View Slide

  47. 4. Условия
    Начин за взимане на решения
    по време на работа на програмата.

    View Slide

  48. 4. Условия
    if  условие  
       изпълни  това,  ако  условието  е  истина  
    else  
       иначе  изпълни  тази  част  
    end

    View Slide

  49. 4. Условия
    братчеда  =  Човек.нов(name:  'Пешо')  

    View Slide

  50. 4. Условия
    братчеда  =  Човек.нов(name:  'Пешо')  
    if  братчеда.гладен?  
       братчеда.иди_да_обядваш  
    else  
       братчеда.изиграй_едно_хоро  
    end

    View Slide

  51. 5. Цикли
    • Начини да повтаряте едно и също действие
    многократно (т. нар. "цикли")
    • Повече от един начин да стане това;
    избираме си различни, според ситуацията
    • В Ruby е малко по-особено (и готино),
    отколкото в други езици за програмиране
    • Принципът е еднакъв навсякъде

    View Slide

  52. 5. Цикли
    30.times  do  
       направи_коремна_преса  
    end

    View Slide

  53. 5. Цикли
    100.times  do  |номер_на_участник|  
       имейл_адрес  =  намери_имейла_на_участник_по(номер_на_участник)  
       изпрати_подсещащ_имейл_до(имейл_адрес)  
    end

    View Slide

  54. 5. Цикли
    5.пъти  {  
       покажи_текст_на_екрана  "Здравейте!"  
    }

    View Slide

  55. 5. Цикли
    5.пъти  do  
       покажи_текст_на_екрана  "Здравейте!"  
    end

    View Slide

  56. Най-важният шаблон
    данни.име_на_действие(опции)  
    обект.име_на_действие(опции)

    View Slide

  57. Приложението
    (приложение ≈ уебсайт)

    View Slide

  58. Уебсайт?
    Мътно понятие…

    View Slide

  59. http://bit.ly/about-web

    View Slide

  60. Речник
    • Сървър – компютър, закачен за интернет
    • (Уеб) сървър – помощна програма
    • Клиент – браузърът на потребителя
    • Интернет – компютри, свързани един с друг
    • Уебсайт – HTML + CSS + картинки + …,
    преточващи се от сървъра към клиента

    View Slide

  61. Типове уеб сайтове
    • Статични — едно и също, во веки веков
    • Динамични — шаблони, попълвани с
    данни; може и да има интеракция с
    потребител, може и да няма
    • Приложението, което ще правим днес,
    попада във втората категория
    • И за двата вида имаме нужда от
    помощната програма “сървър” и от
    компютър, на който тя да работи

    View Slide

  62. Как разработваме сайт?
    • Обикновено имаме “локално” копие
    • Файлове, код, картинки + сървър + БД
    • Редактираме си кода и файловете локално
    • Разглеждаме си промените локално
    • Когато сме готови, копираме новия код,
    картинки, файлове на реалния сървър
    • Nitrous.io ще замества вашия компютър

    View Slide

  63. Динамични уеб сайтове
    • Още — приложения (applications, apps)
    • За тях имаме нужда от “логика” на сървър
    • “Логика” = програма, написана на език за
    програмиране
    • Ще се забавляваме с това днес,
    използвайки Ruby

    View Slide

  64. “Идейник”
    Събиране на идеи, състоящи се от име,
    детайлно описание и евентуално снимка

    View Slide

  65. View Slide

  66. Нашето просто начало
    • Добавяне на идеи
    • Списък с идеи
    • Редакция на идеи (идентичен екран с този
    за добавянето)
    • Ще използваме Ruby on Rails

    View Slide

  67. Ruby on Rails?

    View Slide

  68. Руби на релси
    • Ruby on Rails е голяма купчина код
    (“фреймуърк), която някой е написал вместо нас,
    за да ни улесни в направата на уеб приложения
    • Можем да я ползваме безплатно
    • Ruby on Rails има страшно много неща, вградени
    в него, вкл. и (уеб) сървър
    • Можем и без Рейлс, но ще се поизпотим
    • Ruby on Rails е много добър фреймуърк
    • Може да се изхранвате с Ruby on Rails :)

    View Slide

  69. Раждането
    на едно приложение
    • Звучи сложно, но не е
    • Най-важното —
    • Започвате с малки стъпки и надграждате на
    итерации
    • Експериментирате
    • Учите се от грешките си
    • Подобрявате и повтаряте цикъка

    View Slide

  70. View Slide

  71. Уъркшоп 1

    View Slide

  72. Да си изцапаме
    ръцете!

    View Slide

  73. TryRuby.org
    • Променливи и данни (стойности)
    • Връзки между тях
    • Типове данни (стойности) – числа, низове,
    списъци, речници…
    • Синтаксис – защо всеки символ е важен?
    • Абстракции – методи, класове
    • Каквото вие питате инструктора си :)

    View Slide

  74. • http://bit.ly/railsgirlssofia4 + http://bit.ly/cheat-rails
    • http://tryruby.org (или gem install rails-girls-
    sofia-tryruby и го стартирайте с tryruby)
    • Първо HTML + CSS
    • Инструменти — конзола, текстов редактор, браузър
    • Изгледи – ERB и HTML. Routes (маршрути/URL-и).
    • Бази от данни – “Big data is when Excel crashes…”
    • Контролери, модели, сървър – бегло.
    • Rails генератори; Scaffolds; Gems и управлението им
    Уъркшоп 1

    View Slide

  75. ОБЯД!!!!!!!!!!!!!!!!!!!!!!!!!!
    (невъзможно кратък)
    (~1800 секунди)

    View Slide

  76. http://www.youtube.com/watch?v=qObzgUfCl28

    View Slide

  77. ห౰

    View Slide

  78. Бенто бокс

    View Slide

  79. Speak Geek.
    Or how to teach the language of web
    Friday, March 23, 12

    View Slide

  80. 2
    Friday, March 23, 12

    View Slide

  81. Why Bento?
    • You need a balanced mix of things.
    • It’s a puzzle - putting everything
    together in the box.
    • “Ekiben“ - content which is arranged in
    the most efficient, graceful manner.
    The bento is presented in a simple,
    beautiful, balanced way. Nothing
    lacking. Nothing superfluous. Not
    decorated, but wonderfully designed.
    Friday, March 23, 12

    View Slide

  82. 4
    Friday, March 23, 12

    View Slide

  83. HTML
    AJAX
    CSS
    RUBY, PYTHON, PHP, SCALA
    MYSQL,
    MONGODB
    RUBY ON RAILS, DJANGO,
    CAKEPHP, JETTY , LIFT….
    XML
    JAVASCRIPT
    DOM
    UNICORN
    Friday, March 23, 12

    View Slide

  84. Etsy:
    “We use a number of different programming languages (including Matlab!) but
    are primarily a PHP shop. We have a number of databases, some of which
    are MySQL and some of which are PostgreSQL. “
    Friday, March 23, 12

    View Slide

  85. 7
    PHP + Matlab
    MySQL
    PostgeSQL
    Friday, March 23, 12

    View Slide

  86. 8
    Foursquare:
    “Server code is written in scala running on the lift web framework using
    jetty for a webserver. We front everything with nginx, and use HAProxy in
    between.
    MongoDB handles most of our data storage needs (though a bit hasn't been
    migrated off PostgreSQL yet).
    Friday, March 23, 12

    View Slide

  87. 9
    MongoDB and
    PostresSQL
    Nginx + HAProxy
    Lift
    Scala
    Friday, March 23, 12

    View Slide

  88. R
    #1 HTML/CSS
    #2 JQUERY
    #3 Unicorn
    Friday, March 23, 12

    View Slide

  89. HTML CSS
    Friday, March 23, 12

    View Slide

  90. HTML
    AJAX
    CSS
    XML
    JAVASCRIPT
    DOM
    Friday, March 23, 12

    View Slide

  91. UNICORN
    Friday, March 23, 12

    View Slide

  92. R
    #1 PHP
    #2 SaaS
    #3 RoR
    #4 HTML
    #5 MongoDB
    Rules: Figure out the term and place it on the bentobox in
    the right place..
    There might be false friends and doubles.
    Googling allowed!
    You have five minutes – wrong answers will be removed,
    the team with most post-its wins!
    #6 Apache
    #7 CSS
    #8 Django
    #9 MySQL
    #10 nginx
    Friday, March 23, 12

    View Slide

  93. 5 minutes.
    Game on!
    Friday, March 23, 12

    View Slide

  94. HTML
    PHP
    SaaS
    RoR
    MongoDB
    CSS
    Apache
    Django
    nginx
    MySQL
    Friday, March 23, 12

    View Slide

  95. R
    #1 PHP
    #2 SaaS
    #3 RoR
    #4 HTML
    #5 MongoDB
    #6 Apache
    #7 CSS
    #8 Django
    #9 MySQL
    #10 nginx
    Logic. PHP is a very popular language designed to produce
    dynamic Web pages. It goes well with HTML.
    - What makes PHP special?
    - Why it’s so popular?
    No where. Software as a service. Not a technical term - more a
    business/delivery model, in which software is hosted centrally,
    not by the user themselves and they often pay a subscription
    fee. Examples range from Salesforce, Spotify, Google Docs..
    - What other buzzwords are there that are not technical?
    Logic. Ruby on Rails. Sometimes abbreviations might fool
    you!
    Style & structure. Especially structue: HTML is what
    describes the structure and the (static) content of the
    website.
    - What is XHTML? HTML5?
    - Scripting language vs. markup?
    Database. An open source database system. Stores the web
    app data in a little different way than MySQL, making it
    easier and faster for certain types of apps.
    - What are noSQLs? Why is MongoDB so popular?
    Infrastructure. A popular open source HTTP server software.
    Servers can be hardware or software - here we’re focusing on
    the latter. Servers are the piece of software that deliver the
    web page to you.
    - What is HTTP? What is the role of the browser?
    Style and structure. Especially style, designed to describe the
    look of webpages, including elements such as the layout, colors
    and fonts.
    - Why is CSS important when building bigger sites?
    - What is CSS3?
    Logic. A similar framework as Rails is for Ruby, Django is for
    Python.
    - What other examples of popular frameworks are there? For
    Ruby?
    Database. Worlds most popular open source database system,
    used by Facebook, Twitter, Wordpress etc. Well baked into many
    software stacks like LAMP
    - Talk about LAMP and other software stacks
    - Talk a little about open source
    Infrastructure. Pronounced “Engine X”. An open source HTTP
    server. Said to be faster than Apache - in many ways like
    MongoDB is for MySQL.
    - What are proxies?
    - Talk about
    Friday, March 23, 12

    View Slide

  96. Lightning Talks

    View Slide

  97. Димитър Димитров

    View Slide

  98. View Slide

  99. View Slide

  100. View Slide

  101. View Slide

  102. View Slide

  103. View Slide

  104. View Slide

  105. View Slide

  106. View Slide

  107. View Slide

  108. View Slide

  109. http://trudovak.herokuapp.com/
    https://github.com/rails-girls-sofia-study-group/trudovak
    Създадено от вас.

    View Slide

  110. View Slide

  111. Как да счупим света
    Борис Петров

    View Slide

  112. ЖЕНИТЕ-ПИОНЕРИ
    В
    ПРОГРАМИРАНЕТО

    View Slide

  113. „МЪЖКА РАБОТА“

    View Slide

  114. ПЪРВИЯТ ПРОГРАМИСТ - АДА
    ЛЪВЛЕЙС

    View Slide

  115. The greatest machine that never was

    View Slide

  116. „МОМИЧЕТАТА НА ЕНИАК“
    Researcher reveals how “Computer Geeks” replaced
    “Computer Girls”

    View Slide

  117. ГРЕЙС ХОПЪР

    View Slide

  118. View Slide

  119. LIN2 R SRX U PHR3
    50 COMMA B COUNT
    L ZERO Q RESET
    S ONE H COUNT
    00 U LIN21
    RESET B NINE9 H COUNT
    LIN21 R SRX U PHR1
    50 VOTW 50 PRDCR
    50 CR B COUNT

    View Slide

  120. OPEN INPUT sales, OUTPUT report­out
    INITIATE sales­report
    PERFORM UNTIL 1 <> 1
    READ sales
    AT END
    EXIT PERFORM
    END­READ
    VALIDATE sales­record
    IF valid­record
    GENERATE sales­on­day
    ELSE
    GENERATE invalid­sales
    END­IF
    END­PERFORM

    View Slide

  121. БАРБАРА ЛИСКОВ

    View Slide

  122. ЛИНДА ЛЮКАС

    View Slide

  123. ВИЕ?

    View Slide

  124. БЛАГОДАРЯ!

    View Slide

  125. За още една “мъжка” професия
    …и един експеримент

    View Slide

  126. View Slide

  127. Мария Склодовска-Кюри
    (1867-1934)
    Радиоактивност
    Нобелова награда по
    физика (1903)
    Два нови химични
    елемента: Po & Ra
    Нобелова награда по
    химия (1911)

    View Slide

  128. Лиза Майтнер (1878-1968)
    Част от екипа, открил
    ядреното делене, за което
    Ото Хан получава
    Нобелова награда (1945)
    21 високи научни отличия
    Първата жена член на
    Австрийската Академия на
    Науките

    View Slide

  129. И мъжете във физиката искат да има повече
    жени във физиката
    Ако искате да правите нещо, но то изглежда
    “запазено” за мъже, това не трябва да ви
    отказва!

    View Slide

  130. И Експериментът…

    View Slide

  131. Why Learning to Code is
    So Damn Hard
    http://www.vikingcodeschool.com/posts/why-learning-to-code-is-so-damn-hard

    View Slide

  132. View Slide

  133. View Slide

  134. View Slide

  135. View Slide

  136. View Slide

  137. Над 3 милиарда
    Resource density

    View Slide

  138. View Slide

  139. View Slide

  140. View Slide

  141. View Slide

  142. View Slide

  143. View Slide

  144. View Slide

  145. View Slide

  146. View Slide

  147. View Slide

  148. View Slide

  149. View Slide

  150. Уъркшоп 2
    • http://bit.ly/railsgirlssofia4 + http://bit.ly/cheat-rails
    • http://tryruby.org (или gem install rails-girls-
    sofia-tryruby и го стартирайте с tryruby)
    • Изгледи – ERB и HTML. Routes (маршрути/URL-и).
    • Бази от данни. ActiveRecord. Контролери, модели.
    • Rails генератори; Scaffolds.
    • Външни библиотеки (gems) и управлението им.

    View Slide

  151. Как да продължим?
    1. Продължете да пишете (код)
    2. Работете над нещо реално
    3. Поддържайте връзка помежду си
    4. Забавлявайте се!

    View Slide

  152. Study групи

    View Slide

  153. View Slide

  154. Study групи
    • Седмични срещи в местния хакерспейс
    • Ще има поне един инструктор
    • Без “домашна” работа
    • Трупаме реални знания чрез практика
    • С начинаещи ще започнем от нулата

    View Slide

  155. Study групи
    • Четвъртък и петък, 19:30 - 22:00
    • Идвате един от двата дни
    • Имаме място за около 10-ина човека на ден
    • Не е фатално, ако понякога изпускате
    • Ако има повече желаещи, ще го измислим

    View Slide

  156. Study групи
    • Напълно възможно е да се научите
    • Няма тайна – трябва да отделяте време
    • Ще си помагаме много, но трябва да сте
    мотивирани да изкачите планината сами

    View Slide

  157. За да се присъедините
    • Включете се във Фейсбук групата
    • facebook.com/groups/RailsGirlsSofiaStudyGroup
    • Имаме и пощенски списък
    • Запишете се в един от двата дни в графика
    • Елате с лаптоп и желание :)

    View Slide

  158. Ресурси 1/2
    • http://bit.ly/rg-sofia-keep-coding
    • http://bit.ly/joan-on-rails (~30 min)
    • http://ruby-for-beginners.rubymonstas.org/
    • Безплатна книга “Learn Rails” от Daniel
    Kehoe (Отивате на http://learn-rails.com/
    railsgirls и ползвате кода RAILSGIRLS)
    • Защо книга?

    View Slide

  159. Ресурси 2/2
    • http://railsgirls.com/materials
    • http://explainshell.com/ (за конзолата)
    • http://try.github.io/ (за Git!)
    • http://bit.ly/learn-rails-1 (Quora)
    • http://bit.ly/learn-rails-2 (Quora)
    • http://bit.ly/ruby-in-100-mins

    View Slide

  160. Афтърпарти!
    • След 20 ч. в Ink BAR, ул. Славянска 36
    • Имате по едно питие от нас
    • Отворено за всички, дори и извън събитието
    • Да положим основите на community-то :)

    View Slide

  161. View Slide

  162. View Slide

  163. View Slide

  164. Благодарности
    • На г-жа Паси, Марти, Марта, Ели, Георги, Ади
    • На всички инструктори
    • На спонсорите и партньорите ни
    • На домакините от Бетахаус
    • На вас!

    View Slide

  165. View Slide