The Beginnings of my Journey into Web Development

JekkilekkiI just posted a page that will show off my web development skill set, and help me to remember my goals as far as self-study and further development goes.  But, since everything I typed today sounded more like a trip down web-devleopmemory-lane than a real “skill set” I thought I’d post my journey here as well (so that I can edit that page at a later date).

Enjoy!

My Web Software Journey

FrontPage

My background in website design began in 2002 at my university with FrontPage.  I designed and was Webmaster for InterVarsity Christian Fellowship’s homepage there for 3 years.

GooglePages and iWeb

For a while after that, I was involved with GooglePages and  iWeb on my MacBook to develop my own personal sites.

Nvu and Introduction to CSS/XHTML

Later, in early 2008, I offered my help to redo my church website (AICF – Antioch International Christian Fellowship) (from GooglePages to something more corporate feeling using CSS and XHTML).  The pastor originally found a template called Multiflex-2 from G. Wolfgang and I used that and Nvu (open source, like Dreamweaver) to transfer all the text and images to the new site.  I updated all the links, created new pages, and added a custom menu bar to the pages with CSS and images.

Blogger, WordPress, WordPress Theme modification,  and Podcasting

I tried out Blogger.com in 2007 before redoing the AICF church website in order to keep track of my (failed) marathon training program.  From Blogger.com, I moved into GooglePages, but both of them lacked a certain feel and customization level  that I wanted.  When I offered to redo the AICF church website, I started looking into WordPress at that time as a way for me to try to start keeping and updating a more regular personal blog.  However, I didn’t really play around with WordPress too much until my pastor asked me start uploading his sermons to the web as Podcasts (spring 2004).  At this point I realized that WordPress would be one of the best ways for me to easily add new content and Podcasts to the church website without creating an entire new XHTML page by hand every time.

I looked for a WordPress theme online that matched the original template that I’d used on the homepage, but couldn’t find one.  So, I used the next best thing: a similar WordPress template based on the same template author’s work that I downloaded and modified the CSS of to match the original AICF church homepage.

CSS Table-less Design from Templates, more WordPress, and del.icio.us

After my success with CSS, XHTML, and WordPress, I wanted to rebuild my own website again with my new skills (this in summer 2008).  I wanted a site that would contain (1) my schedule for a normal work day (teaching English classes in Korea), (2) would have a to-do list, (3) a reminder of where I left my bike, and (4) the weather for the day (I hate being caught in the rain when I ride my bike to work).  Additionally, I wanted the site to be able to (5) automatically select the day of the week and display that page, (6) have a count-up day timer from a certain point, and (7) would be able to save information in my to-do list, or bookmarks in a way that I could use them from anywhere: a Mac, Windows, home, work, or an Internet Cafe.

To deal with (7) I started to investigate Del.icio.us and registered there, and I’m pleased with the service (although I still sometimes have to remember to use it instead of just emailing myself links).

Numbers (2), (5), and (6) were accomplished by finding and using some Javascript code from Dynamic Drive and although I didn’t fully understand everything, I knew enough from my background in Computer Science to be able to change and edit the parts I wanted to play with.

For the weather (4) I used Accuweather (since they do International cities too -> I think weather.com only does US cities).

For my schedule of teaching (1) for a normal work day, I wanted some kind of accordion that would function and open to display my teaching responsibilities when I clicked on the class name.  After much searching, I found something that used CSS and Javascript to work.

For the reminder of where my bike was (3), I investigated cookies and decided to use a cookie in connection with some dynamic Javascript code from Dynamic Drive again to make that work.  It would automatically ask where my bike was when I loaded the page, and would dynamically update the location anytime I chose to change it.

In addition to all these things, I had wanted to keep track of a Bible-reading plan I made, and I thought it would work best in a database like MySQL and PHP (just from what I’d read), but I still haven’t had time to work that all out.

For the actual page layout itself, I found and downloaded a really good looking table-based layout template and a similar CSS template that I used together and “morphed” into one.  I changed the color scheme for each day of the site using the different settings for Accuweather’s client and Color Scheme Designer online.

Check out the actual final result! -> (once I re-put it up on my new homepage)

CSS and XHTML from scratch, 1st attempt

After reading HTML Utopia: Designing Without Tables Using CSS from SitePoint.com and doing the exercises with CSS and XHTML in there, I figured I’d learned enough to try programming my own website from scratch.  I designed it in GIMP, and programmed simple CSS and XHTML to make it fit like I wanted it, but I didn’t do much testing on it, or cross-browser checking as it didn’t really stand out to me as a very good design.

CSS and XHTML from scratch, 2nd attempt

I then read The Principles of Beautiful Web Design from SitePoint and found out about their site 99designs.com.  I really wanted to try out what I’d learned, so I started designing websites in Photoshop and entering contests on the site.  I won one design contest within 2 weeks and was encouraged that “maybe I’ve got a knack for this sort of thing.”  That one was no coding, but in the second contest I won, the client asked for CSS and XHTML code.  I had enough tools at this point that it was time to put them to good use.  I coded the site in one week and validated it with the W3C CSS and XHTML validators, but then I realized that I had to do cross-browser testing and modifications to deal with CSS problems in Internet Explorer.  After a week or two of fixing things, I had the finished result: looks good too!

Software -> Code in the Future

The next things I feel I need to learn in terms of web development (and in order of intended study) are as follows:

  1. CMS (Content Management Systems): Joomla, Drupal
  2. Javascript
  3. Flash
  4. MySQL
  5. PHP
  6. AJAX
  7. ASP.NET (maybe)

I need to figure out CMS first because I need to update (again) the AICF church website.  Currently, the majority of the pages are only in CSS and XHTML, and as the site now contains well over 1200 files, it is getting a bit big to manage.  If I want to change one small thing, I have to go into multiple pages to change it.  Therefore, I think it is wise to set-up Joomla, or Drupal (I’m still learning about both) in order to better manage my content.  I think that WordPress is great for a blog, but for website like this, I may need something else (also it’s good to have a good idea of what each CMS is capable of so that I’m better aware of my options (and client options) in the future).

Javascript is just as essential for a web developer as CSS and XHTML.  Those are the key three building blocks in modern web development.  So, rather than just copying and pasting, I need to explore what is truly possible with Javascript.

Although I’m just about sick of Flash because of it’s overuse on Korean websites (I’ll post on that later), I think that it is important for me to learn about it and develop a site using it in order to add to my portfolio.  Additionally, if I ever want to find a web development job in Korea, I’ll need that logged away in my skill set (who knows, I may even find something I like about it).

MySQL and PHP are the basic building blocks of CMS, and therefore I need to learn those as well.  I have a great introductory book about the subject called Build Your Own Database Driven Website Using PHP and MySQL which is also from SitePoint.com.

AJAX would be great to learn for its dynamic properties (things like Google Maps use it) and letting users change things on a page without changing the page URL.  I also have Build Your Own AJAX Web Applications from SitePoint.com.

ASP.NET would be last on my list to learn because it seems to be a bit more specialized than the other basic web design tools and it is a Microsoft tool.  Although more websites are using it these days (and I heard good things about it’s security features), I think I’ve got enough on my plate already without tacking this on as well.

Well, here’s to my future studies!

Advertisements

One Response to “The Beginnings of my Journey into Web Development”

  1. marem Says:

    ! Nice site
    Keep posting, and mate thanks.
    there is nothing in the world I enjoy more than learning joomla. In fact, i’d rather be learning joomla now!


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: