General Front End Development Process

Post on 22-Jan-2018

31 views 0 download

Transcript of General Front End Development Process

Hürriyet IT Takımı ile Teknolojide Atılım

Hello!I am Murat Do anğDigital Dream Developer @ Hurriyet

2

What are our topics?

3

● Responsibility

● Tools

● Learning

● Q & A

ResponsibilityWhat is the process of the development

1

5

Designers

“ We’ve decided to use larger and blue buttons

according to our user research

reports

6

7

Backend Developers

“ We’re rebuilding our architecture using new micro

services technology

8

9

Front End Developers

“Lorem ipsum dolor

sit amet !

10

Front End WorldLet’s start with the history

11

2007’s Front EndConcerns

12

IE6 Problem

Tables vs Divs

W3C

Ajax

PSD2HTML

xslt

13

2017’s Front EndConcerns?

“ Front end development is not

just converting design to html

anymore.

14

15

Front End Development is :

● Real time● Incremental● Asynchronous● Reactive

16

17

Tools

Let’s split our goals

18

19

HTML 5Hypertext Markup Language revision 5 (HTML5) is markup language for the structure and presentation of World Wide Web contents. HTML5 supports the traditional HTML and XHTML-style syntax and other new features in its markup, New APIs, XHTML and error handling.

20

CSS 3A cascading style sheet (CSS) is a Web page derived from multiple sources with a defined order of precedence where the definitions of any style element conflict.

21

And…

22

JavaScriptan object-oriented computer programming language commonly used to create interactive effects within web browsers.

23

JavaScript Frameworks

24

● Angular

● React

● Vue

Angular

25

● Backed by Google

● Since 2009

● Current Version : 4

React

26

● Backed by Facebook

● Since 2011 / Facebook feed

● Current Version : 16

● Bonus: React Native

Vue

27

● Created by Evan You

● Since 2014

● Current Version : 2.5

How to catch up new trends?The most important thing is staying updated. You should split up your learning methodologies. Here are the list:

28

● Read

● Watch

● Practice

Read!There are lots of blog posts, feeds to follow.

29

● Medium

● Twitter

● Stackoverflow

● Mailing lists

● Facebook Groups

● Quora

● Blogs

● Bonus: Panda

WatchThere are lots of blog posts, feeds to follow.

30

● Youtube

● PluralSight

● Egghead.io

● Udemy

● Lynda

● Coursera

● Udacity

● Khan Academy

PracticeThere are lots of blog posts, feeds to follow.

31

● Localhost

● HackerRank

● Github

● StackOverflow

32

Thanks!Any questions?Github: @muratdogan17/Linkedin: @muratdogan17/Twitter : @murat_dogan17Medium: @muratdogan