Welcome to our website!

1stwebdesigners is a miniature site focused on building nice web-based applications. It is currently run by two human in his spare time, the Bilal Ahmed and Janitor Jesse. If you are interested in learning programming, you can watch Video Tutorials to learn. You can also download Open Source files to help you on your way.

Friday 8 June 2012

Common JQuery Mistakes



These are a few mistakes I often make when rushing through JQuery code. I don't know why I keep repeating the same mistakes! After making a video maybe I'll stop messing up so much. I hope this helps you when you find yourself in a pickle!

JQuery UI Tutorial | Progress Bar



In this JQuery UI Tutorial we look at the UI Progress Bar. I show you how to use it and make a password checker to extend the bar depending on the password strength.

JQuery UI Tutorial | Dialog



This tutorial is about JQuery UI Dialog. It's very easy to use and I'll show you some tricks on making your site feel richer just by using this little feature alone!

JQuery UI Tutorial | Sliders



This an introduction of a JQuery UI Tutorial. We start off by learning to use the sliders and make them change something in the DOM. It's really great and JQuery UI is awesome!

JQuery Game Tutorial | Moving a Character | 17




This is a quick JQuery Game Tutorial. We aren't going crazy, but we'll use HTML, CSS and JavaScript to make a little character move with the arrow keys. If you want to do further building, this could give you some idea as to handle Key Strokes in JavaScript.

Learn JQuery Tutorial 16 | Tools & CSS3 Selectors




In this JQuery tutorial I'll show you the Chrome JavaScript Console which can come in handy. Also a few tricks on selecting a numeric listing with a CSS3 selector.



Learn JQuery Tutorial 15 | Arrays




JQuery Arrays are the same as Javascript Arrays, and the functions are just like PHP, Python, Java, etc. So this is a great principal to understand, and I'll play around with them and I hope it helps you see how they work.



jQuery Sortable Saving in PHP




I'll show you how to save jQuery Sortable data with PHP and MySQL. Get the  From Code Here: http://jream.com/forum/index.php?app=core&module=attach&section=attach&attach_id=6


Raphael JS Quickstart




Raphael JS can be used to create SVG graphics on your website. It's an amazing JavaScript plugin that is well worth learning if you plan to draw graphs or grids, or anything really.
  • Raphael JS @ http://www.raphaeljs.com



Prototype JS AJAX Get (JSON)



Prototype JS is a JavaScript framework a lot like JQuery, but a bit more advanced it appears (in my opinion). Here I'll show you how to do an AJAX Get with JSON data since it took me a little while to figure out how to parse the JSON correctly. Prototype JSON Get

Learn JavaScript - Arrays



These are for organizing data in sets. I use a pretty lame example but you should start with something simple. A use for an array might be a bunch of user emails assigned to a username. This is basic language stuff you have to know if you wanna get good, practice practice! JavaScript Array Videos

Learn JavaScript - Functions



It's starting to get a little trickier with functions, so make sure you understand arguments inside a function. I made a few examples to follow. I would highly recommend using framework like JQuery over using getElementById, and body onload="init()", but this is for learning because when you understand the core of JS the rest comes easy. JavaScript Function Video

Learn JavaScript - Loops



Here we do some loops in javascript. This is in every programming language so you shouldn't have any reason not to understand it :) JavaScript Loop Video

Learn JavaScript - Quick Start!



Here we jump into JavaScript- It's already built into your web browser, so let's get started and do aLearn JavaScript Video.

Learn Java Functions Tutorial 6



Here we talk about the java functions and what Static means. Then we learn how to create a regular function inside another class. It might appear confusing at first, but if you type as I type you will start to understand!

Learning Java Tutorial 1 | Installation




The first thing is to install the Java SDK (Software Development Kit). Then we plug Java into the command console on Windows (We may use this time to time). I show you NetBeans if you choose to use that, I like it. If you install this on Linux it will automatically be available in the Terminal.



Learning Java Tutorial 5 | Arrays




In Java, Arrays are like pockets of data (and every other language). Imagine having a coat, and that coat had 25 pockets, the coat would be an array, and the pockets are the slots that can hold different values. This makes collecting and managing data a lot easier than having hundreds of separate variables.



Learning Java Tutorial 4 | Built in Methods




Here we will explore some Java built in methods. These are easy to use and you attach them with the period, eg: instance.method(); We'll do a little bit of String manipulation and replacing for practice.

Learning Java Tutorial 3 | Variables



In this Java tutorial I'll explain how to assign variables. It's different than other languages like Python, PHP and JavaScript, because you have to declare what type of variable it is.

Learning Java Tutorial 2 | Hello World



Java is scary to start with, yes very scary. It's has no mercy to begin with. Everything in Java is an Object, and Java is a compiled language. So we write a simple program, compile it, then run it. It feels like a lot of text to simply write 'Hello World'. If you come from another OOP language, this will be somewhat easy to pickup - but I'm going to assume you are not and I'll go slow.

Which PHP Framework or CMS do I use?



Which PHP Framework do I use? Zend Framework, Symfony, Yii, Code Igniter, CakePHP? How about CMS's? WolfCMS, Drupal, WordPress, ModX, Joomla, the list goes on! I think you should ask yourself, what skill level am I at, and where can I be productive and learn at the same time?

.htaccess Tutorial



We'll mess with a few settings and get a general idea of what you can do with .htaccess. These are some very simple tips. Being a Web Server Administrator is a lot of work, configuring Apache is not an easy task (Or whatever service you use) so don't get too confident too quick! We are only applying permissions/settings to a directory.

.htaccess MOD_REWRITE Tutorial



We are going to make a Page Handler to route every page request to an index.php file. I'll show you some basics and how to grab the URL inside PHP as well. This is fun, but be careful it's easy to mess stuff up!

Wolf CMS Site Setup



This is a fast run down of setting up a naked site in Wolf CMS and some of the features. 
http://www.wolfcms.org/
http://www.wolfcms.org/wiki/

Tortoise SVN Overview & Usage



This is a simple explanation and use of Tortoise SVN on Windows. It's a really good utility and if you use SVN then this is probably the best one for Windows. On Linux RabbitVCS is the best I know of with a GUI.

Facebook PHP Tutorial | SDK



Here I'll teach you how to get started with a Facebook PHP SDK Tutorial. It is extremely easy if you are familiar with PHP. This is a basic introduction to getting facebook data and posting data with your own custom application!

Thursday 7 June 2012

Drupal Blocks



Drupal Blocks kind of make up your application. It's where you position different sections of your sites anywhere you want on your layout, you can even limit what appears on which page. Once you understand how this works you'll really appreciate Drupal! I did this in Drupal 7. Thanks for watching my Drupal Tutorial.

Drupal Content Types



Seems scary, but I hope Drupal Content Types aren't hard to follow after this tutorial. I did this in Drupal 7. Thanks for watching my Drupal 7 Content Types Tutorial.

Drupal Views Tutorial



We make a Blog area using the Drupal Views. I'm using Drupal 7 in this tutorial. These are tricky to use unless you monkey with them a lot. Drupal 7 Views are difficult at first but once you understand what's going on Drupal Views aren't all that scary :)


Drupal Modules Tutorial



These are the Drupal 7 Modules you should get as soon as you install to help you get started and make your life easier. I will run through my favorite Drupal Modules in this tutorial to try and get you started fast!

Drupal Theming Tutorial



Here is how to get started with Drupal 7 Theming. Making a theme at first is confusing so I hope this clear it up, Cheers. Creating a Drupal theme is hard to do unless you know how to do it, so here's a tutorial to theme drupal. Drupal Theme Tutorial.You can download Drupal atDrupal.org

CSS 3 Selectors



These are tricky to figure out at first, and there are more than what I demonstrated. But learn these, practice them, you will also use them in JQuery and Prototype in the future!

CSS Layout Application



A quick run through of Microsoft Expression Web 4 SuperPreview - Whew, Long title!

CSS Button Hover



This was requested so here is how you make a workable button hover with HTML and CSS. It's very easy and makes your site a LOT better.

CSS 960 Grid



I'll quickly show you how a grid layout works in CSS. This is pretty cool and if you put more than 5 minutes of effort into it like I did in this video you could get some fast and easy layouts out of it. It's very easy to figure out so have fun and see which way you like laying out a site the most! CSS 960 Grid Tutorial

HTML + CSS Site From Scratch



We'll build a site layout and a small folder structure in 25 minutes. This is a slower tutorial and a hand-holding walk through to put your HTML and CSS together. Website from scratch tutorial

Learn CSS Tutorial 11 | Liquid Layout



In 3 minutes we will create a CSS Liquid Layout that stretches with your browser as you resize it. Thanks for watching this CSS Liquid Layout Tutorial

Learn CSS Tutorial 10 | Fixed Layout



In only 5 minutes we can create a Fixed Layout for an entire website. Easy Peezy. Fixed means that the area stays the same size when someone resizes the page. CSS Fixed Layout Tutorial

Learn CSS Tutorial 9 | Position: Relative/Absolute



Now we will try out some CSS Floats with Relative, Absolute, and a little bit of Fixed. This is pretty easy to follow, hope you have fun! CSS Position Tutorial

Learn CSS Tutorial 8 | Floats



Since we understand the Box Model from the previous lesson lets move on to floats. These are great for all types of layouts, static or fixed. CSS Float Tutorial

Learn CSS Tutorial 7 | Box Model



This is one of the most IMPORTANT lessons for CSS, because if you do not know this you might drive yourself bonkers trying to fix layouts! CSS Box Model Tutorial

Learn CSS Tutorial 6 | Fonts



Formatting Fonts and Text with CSS. This is very basic and not much description is needed :) Hey Hey! CSS Fonts Tutorial

Learn CSS Tutorial 5 | Backgrounds and Links



Working with CSS Backgrounds and Links. A gentle introduction into Pseudo classes, but only for the links. You'll learn how to use short-hand CSS and save a lot of time typing! CSS Background Tutorial.

Learn CSS Tutorial 4 | Hierarchy and Grouping



Lets increase productivity by briefly learning about the CSS Heirarchy (Inheritence, or DOM Document Object Model), as well as Grouping CSS elements together and overriding groups. CSS Heirarchy Tutorial

Learn CSS Tutorial 3 | External Stylesheet & Organization



Before we get too busy, lets keep organized. This time we learn how to use a CSS Reset file for browser consistency, and we also learn about Inline, External, and Embedded stylesheets. The rule of thumb is: Always use External stylesheets. CSS External Stylesheet Tutorial

Learn CSS Tutorial 2 | ID's and Classes



Here we learn how ID's and Classes work in CSS. They are very simple and you will be happy you know now! CSS ID and Class Tutorial.

Learn CSS Tutorial 1 | Fundamentals



In this tutorial I introduce you to CSS and give you a quick rundown. It isn't necessary to try and explain too much at once, we will jump right into writing some CSS. CSS Fundamentals.