Web Development

Web Development Tips & Tricks, the things that you don’t want to figure out.





Archive for the ‘Web Development

PHP.JS – Your Javascript PHP Library

Tuesday, August 4th, 2009

PHP.JSThe tile may have been a wee bit confusing, partially intended. PHP.JS is one of the most useful tools I’ve seen around, and boy did they do a good job. So, what is it, specifically?

PHP.JS is a Javascript library that has converted pretty much the entire PHP library into Javascript. This is their description:

“PHP.JS is an open source project in which we try to port PHP functions to JavaScript. By including the PHP.JS library in your own projects, you can use your favorite PHP functions client-side.”

It’s completely free (thank you, open source) and can help enormously.

The main question that was on my mind was, “Do I have to download the whole thing?” After all, something that comprehensive is probably pretty hefty.

The answer, thankfully, is no! They have every function broken out into pieces and the ability to download a wide variety of packages, and each package can be modified to add or subtract individual functions.

Well, that’s it for today! If you can’t think of many uses, let me know, because I can think of a plethora of uses.

Have a great day!

-Kerry

Javascript Countdown

Wednesday, July 29th, 2009

Javascript-KitSo… hard… to… find… time… to… post…

Of course I will be attempting to find more time to post as always, try to fit into my schedule, as I have SO much data I would like to share, so trying to find free time (like now), that I can share them with you.

Today, I had to do a Javascript countdown. No big deal, they’re everywhere, I just thought I would show you the one I used, as it worked great. I found it at Javascript Kit, which is a great site to find a good deal of free scripts.

I used one with a very simple function call. I simply reorganized the script code, customized it a little bit, and it worked great. You can find it here.

I would give you a link to the site, but it will only be there for 10 days, so I’ll just give you an image:

Countdown

Have a great day!

jQuery – The beginning of Web 3.0

Tuesday, June 23rd, 2009

jQueryI am fully aware that ‘Web 3.0′ isn’t really defined, other than it’s a step in the direction of a new age in web browsing. I believe jQuery is a large part/start in that direction.

So, what is jQuery?

“jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.”

That just sounds like a new way of writing Javascript, and not all that new and exciting. Essentially, it is just that, but what it brings about can yield spectacular results. It gives you complete control over Javascript and makes you able to change everything with ease.

Recently I had a project that I wanted everything to be on one page. With jQuery I was able to setup a Split-Pane Divider (like the ones you see in an explorer window), a sortable table that you could change the widths of the columns (by dragging), made my own accordion menu that when clicking on an item, dynamically populated the sortable table.

On top of all that, I used ThickBox to make it even more dynamic.

There’s more functionality that I’m not going into here (Calendar Control, etc.), but I ended up with a fully functional page that used multiple database tables and completely functional like a regular web page, without any refreshing, with animated effects (according menu slides down, other fields faded in and out). This is the result of jQuery.

From what I’ve gathered there are four main Javascript libraries, jQuery, Prototype, Dojo and Mootools. From the reviews I’ve read, jQuery is on the top, though some people prefer the others. Dojo might have a little bit more funtionality. All of them have their own plugins, hundreds of things to make your site more functional and increase it’s design with javascript animated effects.

jQuery has full documentation as well as premade visual plugins in their jQuery UI pack.

I’m completely sold and have been using it for a while. If you need tutorials, they have them too.

MySQL INNER JOIN – A Real Time Saver

Wednesday, January 28th, 2009

MySQLOk, so the story behind this post is one of my sites, SendArticles.com. It is an article submission service, and one page, the reports page, was taking 10-15 second to load. I cannot stand waiting that long, it makes me not want to go to the page, yet I have to all the time. This is a dedicated server and it was nowhere near its max capacity, so I knew it had to be something else.

So, I decided to debug it. I removed a small piece of code, and BAM! Loaded in about half a second. I was confused, I put the code back in. 10-15 second delay was back. Ok, that was definitely it. So, it came down to a SQL (despite technically using MySQL, I’m just going to refer to it as the code is the same) query, which was essentially the following:

SQL

SELECT col FROM table WHERE col2 IN (SELECT col2 FROM table2 WHERE col3 = XX AND col4 = XX)

I apologize for the anonymity, but I do feel it’s necessary. Anyway, the main essence of the statement was that it was making a column (col2) match what another SELECT statement found. So, I decided to replace it with an INNER JOIN (I wasn’t in the practice of using them when I first wrote the code).

SQL

SELECT a.col FROM table AS a INNER JOIN table2 AS b ON (a.col2 = b.col2) WHERE b.col3 = XX AND b.col4 = XX

It produces the exact same results, but in about half a second. Almost no time at all, just instant results. So, I’ve resolved to go through every SQL statement in the hundreds of pages of files (luckily nearly all of them are contained in a handful of classes), and change any SQL IN statements to INNER JOIN.

Hope this helped,

Kerry

osTicket – Open Source Support Ticket Script (A Winner!)

Wednesday, October 1st, 2008

osTicket

I posted two rants yesterday, all about bad software and websites.

I was working on SendArticles.com, a new service that Studio98 just launched, and I decided I wanted a support system better than the ghetto contact form we had installed. So, I searched for “open source ticket system”.

The second listing appealed more than the first, and it was osTicket. I had no idea what to expect. I have never worked with the back end of a ticket system before, and never anything to do with installation.

So, I was almost immediately sold with their presentation of the product. I downloaded, installed, and voila, it was up and working!

I did have to go to their Wiki for a couple questions, but that was easy enough. I setup an email pipe system (never done that before), and it worked immediately.

The next step was integrating it. I have integrated many open source systems before. Never has it been this easy. I copied and pasted my header and footer includes to replace the ones they had, and voila, it all fit in like magic!

It still worked, and after messing with the system I had a fully functional support system that just took a few hours to install, customize and implement. All from scratch, with no prior experience.

5 stars to osTicket!

Firefox Extensions (Yet Another Web Developer’s List)

Monday, March 3rd, 2008

I’ve looked a numerous “web developer’s list of Firefox extensions” and have gotten quite a few useful tools, and thought I’d share with you. Note, these are not all my recommended extensions, simply the ones that I think directly affect web development.
Here’s a list alphabetically:

  • ColorZilla – This adds a little Eye Dropper / Color Picker to your browser so you can find the value (RGB or Hex) and has multiple options to add to clipboard in various forms and is extremely useful when working with designs.
  • Firebug – This is a Javascript debugger, and it is a MUST for any Javascript work. This has been my Savior on many occasions, and I barely use it to its full potential as a debugger (haven’t taken the time to study it). It’s easy to do the simple things, and supports the complicated things when you need them.
  • Html Validator – For someone who does a lot of SEO, this will definitely speed things up. It is a built in HTML Validator and gives you a little check mark when the page is valid. Definitely easier than going to an external site for each page. Also, if you’re in a secured section of a website that external sites can’t validate, this will still work.
  • IE Tab - Adds a simple button that will switch between Firefox and whatever version of IE you have on your system. Saves a lot of time switching between browsers.
  • MeasureIt – This adds a little button that will allow you to measure the width and horizontal pixels of a designated area. It creates an expandable box with updated measurements of the pixel size.
  • Web Developer – This is the most useful toolbar you’ll get, it gives you massive amounts of information and many tools that you are invaluable to a web developer. If for whatever reason you don’t have this toolbar – get it. I promise you won’t regret it. It could be compared as useful as a magician’s staff is to a a magician.

That’s it for now.

-Kerry

New Site (Real Estate)

Saturday, October 6th, 2007

I’ve just made a new site for a dear friend of mine, Codi-Rose Collins. She is a real estate agent down here in Burbank, CA, and so I thought I would go about and set her up with a site that listed local listings.

What did I get myself into?! Real estate websites are by far one of the most complicated I’ve come across. In fact, there’s a website dedicated to helping Real Estate Webmasters. Real Estate listings are in a database that is controlled by certain companies, which there are many per state. The site listed above lists them, how you get in contact with them, prove you’re actually doing something with Real Estate, and then you get access, which I still have not done.

So, what’s the alternative? Well, APIs sound fun… I took a look at many of the sites out there; Zillow and Trulia were the most interesting. Zillow will provide you with a lot of information, the closest to what I want, but still not listings of homes to buy. It will get you a home evaluation and comparables, and Trulia can get you a lot of market information.

I did look at many more sites but my search ended with those listed above. There are some bad side-affects of using APIs, and if you do look at the site Codi-Rose Collins you will see that I have to have links to Zillow all over the place. I will quite possibly remove Zillow, or may just thoroughly increase its use to make the links worth it.

Anyway, thats a quick update on Real Estate Sites.

-Kerry

P.S. I just finished DMS v4.0 (look for a blog).

Project Management – activeCollab

Friday, August 3rd, 2007

As my projects and sites have been growing in number I have found it increasingly difficult to keep track of all the projects and tasks associated with each one.

This started my search for a project manager, a free one, of course.

I found various project managers, but most of them you had to pay for or were on your computer. I wanted one on the internet so other people could look at them as well, and possibly update them. I came upon activeCollab.

It was perfect. It has a 10 minute video telling you how to work the whole thing, explaining all the features. It’s very simple (relatively speaking) for a project manager. It has a very easy automated install followed by simple steps to setting up your first project.

It keeps a profile of your company and employees as well as your client companies and their employees, whom you can specify access to specified projects. Easy setup for tasks and milestones(a task with a time target) as well as a message board for each individual project.

I’ve installed this manager on three sites and it has become so very useful. If you’re looking for project management, I suggest you give it a try.

Sincerely,
Kerry

RSS Script

Sunday, June 3rd, 2007

A little over a week ago I decided to immerse myself with RSS information, and this script is the result.

First let me explain the concept of what an RSS feed is for. People these days generally go to many news sites to get information about different topics. They have to go to many different websites, go to that section of the website and see if there is a headline that they’re interested in.

An RSS Feed is a file from that website that can be read from something called an aggregator. An aggregator collects RSS Feeds and displays the newest headlines from each one on a single site or page. It doesn’t generally show you the entire article, but usually just a headline and a short summary. This allows you to look at all your favorite headlines from your favorite news sites, and only go to the ones that you really have an interest in. They automatically updates to the new headlines and marks the ones you read as “read” so that you can easily distinguish the new items.

Onto what I learned.

The first thing I decided to do was find out what RSS is. I went to RSS Tutorial for Content Publishers and Webmasters, and found that it wasn’t really a tutorial but more of an informative guide. I didn’t read the whole thing, but I found out one important piece of information. RSS 1.0, RSS 2.0 and Atom are completely different:

  1. RSS 1.0 stands for “RDF Site Summary 1.0″. It is more complex than the others but gives you more options and customizable features.
  2. RSS 2.0 stands for “Really Simple Syndication”. It’s focus is on simplicity and is one of the most common feed types, and probably most widely known.
  3. Atom came as the result of wanting a standardized format. Both of the other formats are considered “informal”, and people wanted a change. The Internet Engineering Task Force (IETF) took this project on and made Atom the “standard”.

Well, I’m building a database-driven news site. RSS is a mandatory feature, but I also don’t want to have to manually update my RSS feeds. Well, there are sites that will generate it for free for you, like Feed43. I tried this, and its a good service though a little complex to setup. The only problem with it is that the feed has a big advertisement for Feed43 on it. Even though most people would never really see the advertisement (doesn’t show up when the aggregator collects the feed), I thought it wasn’t very professional for a company to be doing something like that.

I decided to make my own generator, and I wanted it to generate it dynamically. I decided to make it create either an RSS 2.0 feed or an Atom feed. This was my logical conclusion as it seems RSS 2.0 is the most common feed on the internet while Atom is considered the “standard”, and I like to uphold standards.

I first just basically copied and replaced values of an Atom feed. I thought it was a smart idea, until I tried to validate it. The validator I’ve seen recommended and the one I ended up using is called Feed Validator (how creative). Even though I haven’t tried any other validators to compare it with, I think its one of the best validators.

Back to my point, my feed failed validation pretty badly. I then found the Atom standard specifications. It had an example as well as a lot of know-how behind everything. After an hour or two, it validated. Great! My script now dynamically created a valid Atom feed.

I then went on to RSS 2.0, and I found the specification off the bat and got it to validate pretty fast.

If you want to see them at work, this is the Atom feed and this is the RSS 2.0 feed.

The second to last thing I’m going to go over is the RSS button. You may not know it, but there is a trademarked image that is freely available under the Feed Icon Guidelines. If you want to get a basic image and manipulate it a bit, a great site is called Feed Icons. These are the “standard” images. If you want some nonstandard ones, this site has a few.

One more note on aggregators. While they are generally on web pages, there is a site, Rmail, that sends you your feed data. I haven’t tried it but it looks like a good idea.

-Kerry

Shopping Cart – Closing in!

Wednesday, May 30th, 2007

The shopping cart I have been developed hit a major slow a couple weeks ago and I couldn’t find a solution, which is very rare. Well, a couple days ago I looked for a PHP forum. This was after I had given up on 1&1 support after many calls and many emails, Paypal thought it was on my hosting end and wasn’t getting many responses and other companies told me to switch hosting providers.

Well, I explained my situation and in about a 24 hour period they figured it was my cURL version was old because it was an old PHP version (4.4.7) on the dedicated SSL. I had tried to get 1&1 to upgrade this before using .htaccess, but your .htaccess files don’t affect your SSL server. I now knew that I had to get it upgraded for it to work.

I was thinking about this for a while. In the mean time I sent a support request to Paypal seeing if there was any alternate solution to using the old cURL version (they didn’t really know what I was talking about) and sent a request to 1&1, thinking I would just badger them a bit more, hoping someone could change it.

Before I go on, I thought I should comment quickly on 1&1. After asking them how to upgrade to the higher PHP version, I explained the reason being I needed to upgrade the cURL version.

They responded and told me I needed to upgrade my PHP version. I responded saying that I had asked that question, and I needed to know how.

Next response tells me that sorry, but you can’t upgrade your PHP version. Great, well I already had another solution worked out, I just didn’t like it.

PHP 5 has its own extension “.php5″. I tried this on the server and it did support it, meaning 1&1 had lied again. This handled my problem and I was able to connect successfully to Paypal! Yes! Now I just have to finish implementing WPP (Website Payments Pro).

-Kerry

P.S. I also have another script that I will be blogging about soon. It generates Atom and RSS 2.0 feeds, but its not in a finalized form though it does work correctly.