Materi Slide cuma 14 halaman, hanya poin-poin saja, penjelasan lebih detail melalui demo tiap slide: Web, Frontend Web Development, Code Editor, HTML, CSS, Browser, Responsive, Bootstrap CSS, Bootstrap Components, Bootstrap Javascript, Sass @ Malang Digital Lounge (DiLo) 29 April 2015

1. FRONTEND WEB
DEVELOPMENT
SINAU BARENG
Malang
29 April 2015
Digital Lounge (DiLo)

2. Moch. Zamroni
@pakzam
Indo.net
2000-2001
Gracia Design
2002-2006
Detail adv.
2006
Utero adv.
2006
Jade
2006-2007
iMMedia
2007-2008
iCreativeLabs
2008-2011
PhaseDev
2011-2013
Tiket.com
2013-recent
LP3I Malang
2009-recent
WPCharity
2010-2014

3. UI/UX
Designer
(Web Designer)
Frontend
Developer
(Client Side)
Backend
Developer
(Server Side)
Hosting
Specialist
(Monitoring)
User
(Client)
WebWeb

4. HTML
(Content)
CSS
(Layout)
Javascript
(Behavior)
Frontend Web
Development
Frontend Web
Development

5. Code
Editor
Code
Editor
Notepad
Notepad++
Sublime Text
Dreamweaver
Eclipse Etc.
TextMate
TopStyle
Atom

6. 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)

7. 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)

8. BrowserBrowser
Mozilla
Firefox
Google
Chrome
Opera
SafariInternet
Explorer

9. ResponsiveResponsive
Desktop
LaptopMobile
Tablet TV

10. Bootstrap
CSS
Bootstrap
CSS
Grid system
Typography
Code
Tables
FormsButtons
Images
Helper classes
Responsive utilities

11. Bootstrap
Components
Bootstrap
Components
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

12. Bootstrap
JavaScript
Bootstrap
JavaScript
Transitions
Modal
Dropdown
Scrollspy
Tab
Tooltip
Popover
Alert
Button
Collapse
Carousel
Affix

13. SassSass
Preprocessing
Variables
Nesting
Partials
Import
Mixins
Inheritance
Operators

14. Terimakasih :)
@pakzam