FRONTEND WEBDEVELOPMENT

SINAU BARENG

Malang

29 April 2015

Digital Lounge (DiLo)

Moch. Zamroni@pakzam

Indo.net2000-2001

Gracia Design2002-2006

Detail adv.2006

Utero adv.2006

Jade2006-2007

iMMedia2007-2008

iCreativeLabs2008-2011

PhaseDev2011-2013

Tiket.com2013-recent

LP3I Malang2009-recent

WPCharity2010-2014

UI/UXDesigner(Web Designer)

FrontendDeveloper

(Client Side)

BackendDeveloper

(Server Side)

HostingSpecialist

(Monitoring)

User(Client)

WebWeb

HTML(Content)

CSS(Layout)

Javascript(Behavior)

Frontend WebDevelopmentFrontend WebDevelopment

CodeEditorCodeEditor

Notepad

Notepad++

Sublime Text

Dreamweaver

Eclipse Etc.

TextMate

TopStyle

Atom

HTMLHTML

Structure(html, head, body,

div, span)Meta Info

(doctype, title, link,meta, style)

Text(p, h1-h6,

blockquote,br, etc)

Links(a)

Images(img)

Lists(ol, ul, li)

Tables(table, tr, td, th,tbody, thead)

Scripting(script)

Forms(form, input, textarea, select,

option, button, label, etc)

CSSCSS

Text & Fonts(font, line-height, letter-spacing,

text-align, text-decoration, text-indent text-transform,vertical-align, etc)

Colours & Backgrounds(color, background-color, background,

background-image, background-repeat, background-position, etc)

Box Model(width, height, padding, margin,

border, outline, etc)

Positioning & Display(position, top, right, bottom, left, clip, overflow,

z-index, float, clear, display, visibility)

Lists(list-style, list-style-type,

list-style-image, list-style-position)

Tables(table-layout, border-collapse,

border-spacing, empty-cells, etc)

Misc.(content, cursor, etc)

BrowserBrowser

MozillaFirefox

GoogleChrome

Opera

SafariInternetExplorer

ResponsiveResponsive

Desktop

LaptopMobile

Tablet TV

BootstrapCSS

BootstrapCSS

Grid system

Typography

Code

Tables

FormsButtons

Images

Helper classes

Responsive utilities

BootstrapComponents

BootstrapComponents

Glyphicons Dropdowns

Button groups

Button dropdowns

Input groups

Navs

Navbar

Breadcrumbs

Pagination

Labels Badges

Jumbotron

Page header

Thumbnails

Alerts

Progress bars

Media object

List group

Panels

Responsive embed

Wells

BootstrapJavaScript

BootstrapJavaScript

Transitions

Modal

Dropdown

Scrollspy

Tab

TooltipPopover

Alert

Button

Collapse

Carousel

Affix

SassSass

Preprocessing

Variables

Nesting

Partials

Import

Mixins

Inheritance

Operators

Terimakasih :)@pakzam