A LOOK ATFRONT-END

DEVELOPMENT

Erin Kirk: Shared Knowledge and Principles

The Basics

Re-evaluate, for a second, everything you know about front-end development and let’s think about the pros and cons of this field of study / job market.

A front-end developer’s job is to shape the experience on the website of each individual’s choice, based on the audience of the particular website, whether it be a business, or a blog.

The Pros of Front-End Dev The ability to be creative and logical at

the same time Tons of opportunity for growth and you

will never stop learning Hot job market in 2014

Now moving onto the cons…

The Cons of Front-End Dev Not enough women in the field as it

stands, to date. Ladies love design, too! Work can be stressful when adhering to

several deadlines at once It is frustrating to have to (still) support

old, outdated browsers. (cough I.E. cough)

Getting All Your Ducks In a Row

HTML CSS Javascript jQuery

Building Blocks

HTMLThe structure of the web page.

Defines elements that make the building block of the web.

Style

CSSThe style of a web pages relies on CSS (cascading style sheets). It, or “they” control how HTML elements are displayed, including color and font.

Java…It Gives You Wings! JavaScript

A programming language that is used in all modern browsers. It is used to make websites dynamic, including animations.

The New Guy…I actually like him. jQuery

A JavaScript library that makes common JavaScript tasks much easier.

Front-End: A breakdown Performance Usability Accessibility Security Internationalization Localization Scalability Mobile platforms Maintainability Browser bugs Debugging Testing Build processes

Conclusion: Not So Simple But, with a change of attitude comes…

- Recognition

- Professionalism

Developers Adjusting All the Time Availability Openness Richness Stability

Understanding the Medium Respect user choice Web layers: semantic, presentation,

behavior Progressive enhancement and energy

Semantic HTML

It must have meaning! For users, machines, and developers

alike Layer richness is important.

Object-oriented CSS

Focus on the left Encapsulate your objects Cascade the look Layer richness also important here.

Unobstructive JavaScript

Separate layer Provide enhanced behavior Mind your manners! Be paranoid. Layer richness, again!

Do the right thing.

Follow standards If impossible, then follow conventions If impossible, then Do what it takes

Important Resources

Sublime Text 2Text editor for cross-platform

coding, mainly used for creating basic .html files.

Adobe DreamweaverWebsite editor (cross-platform) to write and edit code with a split view interface making it extremely

simple to test the waters as you’re coding.

Important Resources, contd. Adobe Photoshop

The grandaddy of all photo editing, file conversion, art, and design

software. Knowing Photoshop just as well as the languages and markup will make your life a lot easier as you will begin to understand design principles, thus not having to pay a UI

designer.

Important Resources, contd. Download the Java SDK from Oracle’s

website Download jQuery from its website (

www.jquery.com) Consult the Google machine and your

loyal colleagues for any other questions, advice, and words of wisdom on Front-End Development.

In retrospect…

This field / job market is extremely rewarding, having started my own business through software development and sales, and having been lucky enough to not only have experience in this field, but patience with myself, I can say that experiencing something mind-blowing, and all other aspects of it, every day is what I love about this wonderful career.