Lecture1
0 likes268 views
This document contains the agenda and notes from Lecture 1 of a WebUI course. It introduces web development topics like languages (Java, PHP, Python etc.), platforms (Windows, Linux, Mac etc.), browsers and devices. It discusses the current trend of everything moving to the web. It defines the role of a front-end developer as someone who works across design, development, user communication and more. The homework asks students to watch a video on front-end engineer roles, choose their preferred role, create a GitHub account and repository, fill out their forum profile, and collaborate with others.
Lecture1
- 2. Agenda • Intro • Web development is … • FrontEnd definition • Environment • Technologies set • Organizational questions, free talking
- 3. Web development is … • current situation • languages and platforms • history
- 4. Current situation Everything is a web based desktop mobile tv glasses watches cars homes
- 5. Languages and platforms • Java • PHP • Python • Ruby • .NET • Scala • Erlang • GO • Bash • Perl • windows • linux • mac • iOS • Android • and many many more
- 7. FrontEnd definition • job specific • knowledge areas • design & development • end-user communication
- 8. Job specific • Psd to html/css • Image optimization, sprites • Animation programming • Font search • Design review • Wireframe implementation • Mockup adaptation • Responsive markup • Interaction programming • Backend integration • Build process optimization • Code refactoring • Solution search • Framework library troubleshooting • User stories review • Unit testing • Writing documentation and style guides • Architecture design • Page load/rendering speed optimization • SEO/SMO friendly • Non-stop communication with people • Non-stop learning process
- 9. Knowledge areas Allen Rabinovich: The Many Hats of the Frontend Engineer https://www.youtube.com/watch?v=rDRr_pUl3i0
- 10. Design & development • if you don’t have a designer — you should became one • if you have a designer — you will need to lead him • if you don’t have other developers — you need to know more • if you have other developers — you need to know even more and teach them
- 11. End-user communication • Feedback is your most valuable data • Feedback is not only a verbal thing: • statistic, heat maps, A/B testing • survey results • verbal • Make sure you gather feedback from your target audience
- 12. Browsers and platforms • Different browsers have different features support • It’s always changing • Nightly builds are your friends • Many versions to support at once, many vendors to support, many OS to support • Not only on a desktop, but almost everywhere
- 13. Technical restrictions • wide screen • mouse/touchpad • keyboard • “work” context • fast connection • multitasking PhoneTabletDesktop • smaller viewport • fingers as the primary input device • optional keyboard • “relax” context • mixed connection • single task • tiny viewport • fingers as the only input device • “hurry” context • slow connection • single task
- 14. Organizational questions • github.com • everyone will need to create account there • name your repositories by lectures with “UIcourse_” prefix • github.com/username/UIcourse_lecture1 • push your homework and send me a message • http://my.lits.com.ua/ forum • use forum for communication with other students • you should try to use english, if you are not ok with this — use any other language
- 15. Organizational questions • All lecture slides will be published at http:// my.lits.com.ua/ • before next lecture I’ll fill calendar • our next meeting is on Thursday • Deadline for your homework is Saturday
- 16. Homework #1 • watch Allen’s presentation • choose what hat you want to wear more than others • register account at github.com • create repository for lecture1 • push there a text file with your answer • login to http://my.lits.com.ua/ • complete your profile with photo • collaborate with others at forum, don’t be shy, create your own topic