Building "The Loop" (Introduction to Frontend Development)

45ca9033757d209fabf1481740d1c936?s=47 Ire Aderinokun
February 18, 2017
Programming
4
210

Building "The Loop" (Introduction to Frontend Development)

forLoop Covenant University conference

45ca9033757d209fabf1481740d1c936?s=128

Ire Aderinokun

February 18, 2017
Tweet

More Decks by Ire Aderinokun

See All by Ire Aderinokun
45ca9033757d209fabf1481740d1c936?s=48 ireade
4
800
45ca9033757d209fabf1481740d1c936?s=48 ireade
4
330
45ca9033757d209fabf1481740d1c936?s=48 ireade
6
1.2k
45ca9033757d209fabf1481740d1c936?s=48 ireade
5
360
45ca9033757d209fabf1481740d1c936?s=48 ireade
6
500
45ca9033757d209fabf1481740d1c936?s=48 ireade
7
320
45ca9033757d209fabf1481740d1c936?s=48 ireade
7
1.2k
45ca9033757d209fabf1481740d1c936?s=48 ireade
9
3.1k
45ca9033757d209fabf1481740d1c936?s=48 ireade
3
560

Other Decks in Programming

See All in Programming
B8403d102456248570005ee7fb2ba0f7?s=48 tooppoo
4
430
D882856fd493248c73331872a516d1b5?s=48 exsoul
1
120
5fc8ab822e946a8ddfa46ba15a848392?s=48 fuqda
1
150
70b07e6b7fe7d921d7ac542d0ccb3b2c?s=48 kdmsnr
6
2.9k
5a065e7ea7c56f4b04c2271771688df3?s=48 raykataoka
34
18k
4d78b749c315e21a956053dcbf0508a9?s=48 po3rin
1
130
9ae4f3862d4cb0771cfd36e43252f755?s=48 kurotanshi
0
230
C302e84057a922dce0ecbe80207e3fcc?s=48 mu_zaru
1
170
933291444e456bfb511a66a2fa9c6929?s=48 j5ik2o
7
1.1k
Bbb17eeeecd3d9d06f4db310ab630a12?s=48 borkdude
2
440
38a509643276213e62730e92ef220405?s=48 masatakamiki
0
190
D2fa8ba573b0be722502e673e025a96d?s=48 junichiromoro
1
140

Featured

See All Featured
2bb923c57a1fdc3a2eb484bb8d565fd2?s=48 ufuk
55
5.1k
245cee81a9c424266e5e401d844ea881?s=48 lara
588
60k
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
319
53k
462dad0dd24c568a32dcdb0ae895ae1b?s=48 rasmusluckow
314
18k
3d6ace9554821d552146413bcdf874f6?s=48 trishagee
5
380
9375a9529679f1b42b567a640d775e7d?s=48 schacon
144
6.4k
0bce06bd06ee7a2c4f5500f25dcf7f18?s=48 paulrobertlloyd
70
3.3k
B47b288784fda77a94aeb234ca743c24?s=48 keavy
102
14k
Ae14cc4491ac334f9cd23f9f93b4305e?s=48 orderedlist
325
34k
78b475797a14c84799063c7cd073962f?s=48 holman
458
270k
B3d6434763caa0ef5dc4b792662c49f7?s=48 smashingmag
228
17k
1b75d89772b7eea1f6c89fbf362607d9?s=48 moore
123
21k

Transcript

  1. Building “The Loop”: Frontend forLoop Covenant University Ire Aderinokun

  2. Hello! • Ire Aderinokun • UI/UX Designer and Front- End

    Developer • Blogger at bitsofco.de • Head of Technology at Big Cabal • Google Expert in Web Technologies

  3. What We’ll Cover • Introduction to Markup and Styling •

    Introduction Frontend Frameworks • Building “The Loop”

  4. Introduction to Markup & Styling

  5. None
  6. None

  7. What is HTML? HTML (Hyper Text Markup Language) is structure

    of Web Pages. HTML elements define the content that is represented on any page.

  8. <p> Hello, world! </p> Opening Tag Closing Tag Content

  9. None

  10. Some HTML Elements Element Description <html> Sets the page as

    an HTML page <h1>, <h2>, … <h6> Heading <p> Paragraph <footer> Footer <a> Link (anchor) <input> Text Input Field <div> General Purpose Element

  11. What is CSS? CSS (Cascading Style Sheets) describes how HTML

    elements are to be displayed.

  12. p { font-size: red; } Selector Value Property

  13. None

  14. Some CSS Properties Element Description color Text colour font-size Text

    size background Background margin Margin position Position type border Border box-shadow Drop Shadow

  15. Introduction to Frontend Frameworks

  16. Why Frontend Frameworks?

  17. None

  18. Building “The Loop”

  19. None

  20. Join In! • Install angular-cli using npm • Clone the

    starting repository from bit.ly/theloop-fe

  21. The Final Product http://bit.ly/theloop-app

  22. Thank You! @IreAderinokun