Writing awesome code

# About ## Hans Christian Reinl
Front-End Developer [drublic.de/blog](http://drublic.de/blog/) • [@drublic](https://twitter.com/drublic) • [GitHub.com/drublic](https://github.com/drublic)
# Teams
Everyone has a different code-style.
# Don't force people to adapt your style.
Create code-conventions together.
# How? Adapt best practices. Define Style Guides.
# Style Guides ### & Coding Guidelines Define them before starting a project. Stick to it.
# Good Code
### Don't confuse others!
Awww, this is so smart!

```javascript var ಠ_ಠ = ლ_ಠ益ಠ_ლ === ☃ ? (☃ + π == 0 ? "\u2603" : ß) : 3.1415926535897931159979634685442 ```

No, it's not!



## Document your code

## Code is written for humans ## not machines Write code as if __one__ person wrote it
# Principles
Stick to principles to write awesome code.
# Principles
DRY - Don't WET. KISS
# Worse is Better or New Jersey style Simplicity Correctness Consistency Completeness
# Results
"Easier to read"-code Faster development Better teamwork


# Front-end
# HTML
Build it awesome.
# Douchy Soup
<div class="article">
		    <div class="article-header">
		        <div class="article-headline">Some stupid headline</div>
		        <span class="article-date">04.10.2012</span>
		    </div>
		    <div class="article-body">...</div>
		</div>
		
# Awesomeness

		<article>
		    <header>
		        <h1>Some stupid headline</h1>
		        <time>04.10.2012</time>
		    </header>
		    <div class="article-body">...</div>
		</article>
		
# CSS
Naming Conventions & Robust Patterns. [Re-use](http://css-tricks.com/a-discussion-about-css-reusability/) Code.
# JavaScript
Use naming conventions. Decouple things.
# JavaScript
var peter = "<div class=\"person\">\
        <div class=\"some-classname\">\
        </div></div>";

$peter = $('body').css({ display: "block" }).append(peter);

var classText = "Douchy Text";
var text = $('.person').find('.some-classname').text(classText);
		
# THINK! Is it necessary? How can I improve it? Why might it be slow?
#### Please remember:

# Less is more

Danke!


# ♥ [reveal.js](http://lab.hakim.se/reveal-js/) ♥

Writing Awesome Code • Fronteers Jam Session 2012 • Hans Chr. Reinl / @drublic