<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Fuel Your Coding &#187; xhtml / css</title>
	<atom:link href="http://fuelyourcoding.com/category/languages/htmlcss/feed/" rel="self" type="application/rss+xml" />
	<link>http://fuelyourcoding.com</link>
	<description></description>
	<lastBuildDate>Mon, 09 Aug 2010 14:40:31 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Steps to becoming a front-end web developer</title>
		<link>http://fuelyourcoding.com/steps-to-becoming-a-front-end-web-developer/</link>
		<comments>http://fuelyourcoding.com/steps-to-becoming-a-front-end-web-developer/#comments</comments>
		<pubDate>Mon, 18 May 2009 23:40:05 +0000</pubDate>
		<dc:creator>Gaya Kessler</dc:creator>
				<category><![CDATA[.NET]]></category>
		<category><![CDATA[Javascript]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[xhtml / css]]></category>
		<category><![CDATA[become]]></category>
		<category><![CDATA[becoming]]></category>
		<category><![CDATA[front-end]]></category>
		<category><![CDATA[web developer]]></category>

		<guid isPermaLink="false">http://fuelyourcoding.com/?p=121</guid>
		<description><![CDATA[There are a few things you have to know in order to be a front-end web developer. Where to start and what to learn. This guide will take you through the steps of becoming a front-end web developer.
First things first
Before we start seeing stuff on the screen, we have to make something out of nothing. [...]<p><p><strong>Sponsored by</strong></p>
<a href='http://madebytinder.com' target='_blank'><img src='http://fuelbrand.s3.amazonaws.com/downloads/WhatisTinder250x250.jpg' border='0' alt='Made By Tinder' /></a>
<p><a href="http://www.fuelbrandnetwork.com/advertise/">Advertise on Fuel Brand Network</a>. <br />
  <a href="http://www.fuelbrandnetwork.com">Fuel Brand Network</a> 2010 <a href="http://creativecommons.org/licenses/by-nc-sa/3.0/us/">cc</a> (creative commons license)
</p></p>
<p><a href="http://fuelyourcoding.com/steps-to-becoming-a-front-end-web-developer/">Steps to becoming a front-end web developer</a></p>
]]></description>
			<content:encoded><![CDATA[<p>There are a few things you have to know in order to be a front-end web developer. Where to start and what to learn. This guide will take you through the steps of becoming a front-end web developer.</p>
<h2>First things first</h2>
<p>Before we start seeing stuff on the screen, we have to make something out of nothing. We start at the basics of web developing: <a href="http://en.wikipedia.org/wiki/HTML">HTML</a>. This markup language will draw shapes on the web page and display text.</p>
<p>HTML is not only very important, your whole markup will depend on it. Don&#8217;t touch CSS yet! We&#8217;ll come to that later.<br />
CSS is worthless with a bad markup supporting it.</p>
<h2>1. Learn HTML</h2>
<ol>
<li><a href="http://www.w3schools.com/html/html_intro.asp">Learn basic HTML</a></li>
<li><a href="http://www.w3schools.com/Xhtml/">Learn about xhtml and validation</a></li>
<li><a href="http://validator.w3.org/">Make valid xhtml and validate</a></li>
</ol>
<p>Learning perfect HTML will take some time but it will really pay off later. It&#8217;s way easier to prevent mistakes and track down bugs when the markup is perfect.</p>
<p>Next step is what you&#8217;ve been waiting for; applying CSS.</p>
<h2>2. Know CSS</h2>
<ol>
<li><a href="http://www.w3.org/Style/Examples/011/firstcss">How to apply CSS</a></li>
<li><a href="http://www.w3schools.com/css/css_background.asp">Know all the important aspects of styling</a></li>
<li><a href="http://css-tricks.com/absolute-relative-fixed-positioining-how-do-they-differ/">Learn about positioning</a></li>
<li><a href="http://www.w3schools.com/css/css_dimension.asp">Get to advanced CSS</a></li>
</ol>
<p>You don&#8217;t have to be perfect at CSS. But being good at it will save a lot of time for your designer.</p>
<p>If you plan on becoming a server side programmer you are best off learning a server side language to generate HTML pages now. Take a look at <a href="http://www.php.net/">PHP</a>, <a href="http://www.asp.net/">ASP.NET</a>, <a href="http://java.sun.com/products/jsp/">JSP</a> etc. if you want to know more.</p>
<p>Now that you know good HTML and CSS it&#8217;s time to put in a little <a href="http://en.wikipedia.org/wiki/JavaScript">Javascript</a>.<br />
Don&#8217;t start by using a framework now, you first need to understand what Javascript is and what it can do to alter the layout of the web page.</p>
<h2>3. Rock Javascript!</h2>
<ol>
<li><a href="http://www.amazon.com/s/ref=nb_ss_b?url=search-alias%3Dstripbooks&amp;field-keywords=javascript&amp;x=0&amp;y=0">Read a good book about Javascript.</a></li>
<li><a href="http://net.tutsplus.com/articles/web-roundups/best-of-the-web-january/">Get to know some funny Javascript effects and concepts.</a> (There are a lot on the Internet)</li>
</ol>
<p>After I read a good book and experimented with Javascript on some projects a bit, I wanted to get everything out of Javascript by making nice effects like the other guys do. For this there are a lot of frameworks available, which also happen to make your Javascript coding a lot easier!</p>
<h2>4. Pick your framework</h2>
<p> </p>
<p>There are a few great Javascript frameworks out there. The biggest players in the game are: <a href="http://mootools.net/">MooTools</a>, <a href="http://jquery.com/">jQuery</a> and <a href="http://script.aculo.us/">script.aculo.us</a>.</p>
<p><a href="http://mootools.net/">MooTools</a> is a lightweight Javascript framework which can be used to utilize simple effects on the elements on your page. It doesn&#8217;t have a lot of fancy features, but it does the job. Good choice for beginners.</p>
<p><a href="http://jquery.com/">jQuery</a> might be the most popular one out there. Not without a reason! It&#8217;s easy to apply, it has great docs, maybe even easier to learn and does a wonderful job. Does require some plugins for extra functionality but it&#8217;s a really nice framework. Also has a large community.</p>
<p><a href="http://script.aculo.us/">script.aculo.us</a> is the mother ship of the Javascript frameworks. It&#8217;s big and weights a ton. It might be a bit slower and requires a bit more programming than its competitors, but it is powerful in what it does. The capabilities of script.aculo.us take a lot up in speed, but for that you get complete control. You can create excellent Rich Internet Applications with this framework.</p>
<p> </p>
<h2>Conclusion</h2>
<p>In just a few step you can become a front-end web developer. This might take a while and it might take some time to get used to a language, but it will pay-off in the end.<br />
There is a lot to be learned on the Internet and it is never too late to try out web development and make the web a little more exciting.</p>
<p><p><strong>Sponsored by</strong></p>
<a href='http://madebytinder.com' target='_blank'><img src='http://fuelbrand.s3.amazonaws.com/downloads/WhatisTinder250x250.jpg' border='0' alt='Made By Tinder' /></a>
<p><a href="http://www.fuelbrandnetwork.com/advertise/">Advertise on Fuel Brand Network</a>. <br />
  <a href="http://www.fuelbrandnetwork.com">Fuel Brand Network</a> 2010 <a href="http://creativecommons.org/licenses/by-nc-sa/3.0/us/">cc</a> (creative commons license)
</p></p>
<p><a href="http://fuelyourcoding.com/steps-to-becoming-a-front-end-web-developer/">Steps to becoming a front-end web developer</a></p>
]]></content:encoded>
			<wfw:commentRss>http://fuelyourcoding.com/steps-to-becoming-a-front-end-web-developer/feed/</wfw:commentRss>
		<slash:comments>25</slash:comments>
		</item>
	</channel>
</rss>
