Gavinho Labs

Debug PHP Web Application

by on Jan.22, 2012, under Web

At the time I started programming with PHP (2003) was very difficult to debug web applications. But now, it is very simple.

What you need?

  1. A IDE - Eclipse PDT All-in-one
  2. A server - Zend Server Community Edition

Download, install and open this applications above!

How to setup the Eclipse?

First, you need to create a new PHP project and your “home page”. For example: index.php. Don’t forget to create it inside the DocumentRoot of Zend Server. You don’t know where? Check it here.

Go to menu Preferences > PHP.

PHP Executables: Choose PHP 5.3.2 (CGI) or other;

PHP Interpreter:  Choose the “PHP Version”, for example: PHP 5.3;

PHP Servers:

Define the URL to your Zend Server. For example: http://localhost:10088/. I suggest to change the default entry.

Click OK.

Go to Run menu -> Debug  or Debug Configurations: right click on PHP Web Page -> New.

Define:

  1. Name: A name that you prefer.
  2. Server Debugger: Zend Debugger
  3. PHP Server: Default PHP Web Server.
Test it! Click in Test Debugger. If got Success everything is fine.

One more thing, define the file to start the debug (your home page). For example: /extenser.mobi/index.php

Tip: tab Common: select Debug option at  Display in favorites menu.

Click OK and Done!

And now?

Run the debug: right click in the file and choose Debug As > PHP Web Page.

Leave a Comment :, , , more...

Extenser beta was launched!

by on Jan.21, 2012, under Web

Extenser beta was launched. For now, only in portuguese.

www.extenser.com.br

What is the Extenser?

Extenser is a webapp to convert number to its text format. For example: convert 29 to twenty nine. In this version Extenser convert: cardinal, currency (R$ and Dolar) and ordinal numbers.

This project was made with:

  • PHP 5.3
  • HTML 5
  • Javascript
  • JSON/Ajax
  • Bootstrap, from Twitter
  • JQuery 1.7.1

This version is in continuous test. If you get any problem, please, send me a message.

Your message was successfully sent. Thank You!

Leave a Comment :, , , , more...

Ajax is easy!

by on Jan.14, 2012, under Web

First, what is ajax?

“AJAX is the art of exchanging data with a server, and update parts of a web page – without reloading the whole page.”
w3schools.com

I used in this example:

  • PHP 5.3
  • Javascript
  • JQuery
  • JSON
  • HTML5

Which files did I use?

  • index.php: Page that user request the data;
  • getdata.php: PHP script to process the request.

Download the full source code here.

How does it work?

See the demo!

Index.php

First you need to create the page index.php.

<!DOCTYPE html>
<html lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <title>Ajax with PHP</title>
    <style>
			div.result
			{
			border:2px solid;
			border-radius:15px;
			-moz-border-radius:15px; /* Firefox 3.6 and earlier */
			width:250px;
			}
    </style>
    <script type="text/javascript" src="jquery-1.7.1.min.js"></script>
</head>
 <body>

<h1>Ajax Simple Example</h1>
<h3>with PHP, Jquery and JSON</h3>

<p><label for="param">Param: </label>
<input type="text" id="param" name="param"></p>

<button onclick="javascript:start();">Get</button>

<div id="result" class="result">
<p>Write some data in Param and click in Get. You get the result here!</p>
</div>
</body></html>

I used a simple rounded box to show the process’ result. For that, I define a CSS3 style for <div>. You can see this code at line 6.

I added the Jquery library in line 15. You can download the Jquery library from here.

 Javascript start() function (index.php)

	function start() {
		param = $('input#param').val();
		resultBox = $('div#result');
		request = new XMLHttpRequest();
		sendRequest();
	}

First, I get the value that user wrote at input named param. After, I get the object that represent the box to put the result. These codes (line 2 and 3) I used Jquery.

After that I create the ajax object (or a XMLHttpRequest).

Javascript sendRequest() function (index.php)

    function sendRequest() {
 		request.open("GET","getdata.php?param=" + param,true);
 		request.onreadystatechange= requestHandler;
 		request.send();
    }

This code prepare the PHP script getdata.php (line 2) adding the param. It is similar to a <form> with get method.

After associate the requestHandler and start the request process with send() method.

The requestHandler is a variable that represent a function that will be execute when the request process is finished. It is called a callback function.

getdata.php

<?php
header('Content-type: application/json');
$param = isset($_GET['param']) ? $_GET['param'] : 0;
$data['text'] = "You wrote '" . $param . "'";
echo json_encode($data);
?>

Define the content-type of the result page (line 2). Get the param (line 3). Create an array with the element “text” and the string “You wrote…” (line 4). And finally print to the result a JSON data with function json_encode (line 5).

Javascript requestHandler callback function (index.php)

	 requestHandler = function() {
 		if (this.readyState==4) {
  			if (this.status==200) {
		    		console.log(this.responseText);
		    		resultData = jQuery.parseJSON(this.responseText);
		    		resultBox.empty();
		    		resultBox.append(resultData.text);
  			}
  			else {
  				resultBox.empty();
      			resultBox.append('<p>Error</p>');
  			}
 		}
 	};

Every time this function is executed, and you can use it to control all the process. But in this example I manage only the readyState 4 (request finished and response is ready).

If the status is 200 (OK), I parsed the json data with jQuery function parseJSON. And change the page with others Jquery functions empty() and append(). Did  you see you can access the json value like a property (resultData.text)?

But if it is not OK, I change the page with a simple error message.

Don’t forget to declare all javascript variables.

	var
		request,
		param,
		resultBox,
		requestHandler;

That’s it!

You can download the full source code here and see the demo here.

3 Comments :, , , , , more...

My way to control things to do – Chapter 2 Workflow

by on Jan.13, 2012, under Productivity

What is a thing? Thing is a Task or Reference.

New thing

When you have a new thing, you put it in the inbox quickly. In that moment don’t worry about how you write this thing. You need to write words that remind you of the idea.

After that, in another day or a better time, you process all things in inbox.

I have two ways to processing the inbox depend the type of the thing: task or reference. It is recommend to process your inbox 3 or 4 times per day.

Task Processing

If you can resolve it in 3 minutes. Go on and do this task.

Otherwise, follow this steps:

  1. Fix the description.
  2. Define a due date, if it is applied.
  3. Move this new task (in inbox) to another box (Week, Today, Future, Big Rocks).

Just to clarify

  • Week – task you intend to do in the same week.
  • Today – task you intend to do today.
  • Future – task you intend to do in the future.
  • Big Rocks – task you need to analyse and breakdown to do it in the future.

Reference Processing

  1. Fix the description.
  2. Define tags (it is a short text related with the content).
  3. Move this new reference to another box.

 

4 Comments :, , more...

Bepuu Beta was launched

by on Jan.09, 2012, under Web

Today, I launched the first Bepuu beta.

www.bepuu.com.br

This project was made with:

  • PHP 5.3
  • HTML 5
  • Javascript
  • JSON/Ajax
  • Bootstrap, from Twitter
  • JQuery 1.7.1
  • MySQL
  • APC (Alternative PHP Cache)
  • Cron Job

Features:

  • Upload any type of file.
  • Max size is 90MB. I still trying to setup the host to support until 300MB.
  • The file is available for 10 days.
  • Download link is static, but it is available only for one day after it is generated.

For now, the upload progress bar isn’t working  properly.

E-mail:

  • The sender email is no-reply@bepuu.com.br.
  • If you don’t receive an email, please, check your anti-spam.

Any problem?

This version is in continuous test. If you get any problem, please, send me a message.

Your message was successfully sent. Thank You!

14 Comments :, , , , , , , more...

My way to control things to do – Chapter 1

by on Jan.07, 2012, under Productivity

I will write here how I control my things to do. It is based in methodology, like Get Things Done (GTD). I divided it in some various post and I pretend to show which softwares I use, and how I use it.

First I need to explain some concepts.

In all life we have tasks, references and tasks with certain schedule.

Task with certain schedule

It is a activity that you need to do in certain date and hour. Most of times with other people like a meeting.

Reference

It is everything that you use to do yours activities. It is a article, web pages, web bookmarks, books, pictures, audios, videos, any type of data.

Tasks

Tasks is everything you need to do. Sometimes your task has a deadline, but you can do at any time until this date. It is different of task with certain schedule.

Task types

  • Big Rock - Sometimes you have a idea or a thing to do, but you don’t know what tasks you need to do to do it. When it occurs it is a project, or a Big Rock task. In the future you need to breakdown this task in other minor task, or The Task (see below).
  • The Task – it is the activity that you do and you don’t breakdown.

I’ll see in the next chapter called Workflow.

4 Comments :, , , more...

Bootstrap – A good style to your page easily

by on Jan.02, 2012, under Web

Bootstrap is a very good open-source project. It is great for web developer without web design skills, like me! The approach used is very nice too. I’m using it in Bepuu project and I’m happy. It is very simple and clean.

For example, Bepuu file upload before Bootstrap:

Bepuu after Bootstrap:

I did that with a few hours.

As you see, we can do a lot of things, like: menu bar, stylish buttons, modal window, alert message, grid, table and much more. Check Bootstrap http://twitter.github.com/bootstrap/

2 Comments :, , more...

HTML 5 Forms – a little

by on Dec.27, 2011, under Web

HTML 5 is great and if you working with web application you cannot waste more time – you need to start your learning now! I know that the full specification is not completely defined, but it is not a problem. You can learn and start to use some features because mainly modern browsers support a part of this new standard.

As you see below, with HTML 5 you don’t need to use Javascript to make the basic form validation in client-side. And you can do some tricks to facilitate interaction with user (visitor).

Look that:

<input type="email" id="email_sender" name="email_sender"
autofocus="autofocus" pattern="[^ @]*@[^ @]*" 
placeholder="Your e-mail" required="required">

Do you see what is new?

A new input type (email), autofocus, pattern, placeholder and required.

With HTML 5 you have some new input type, like: email, url, number, range, date picker, search and color. But attention, some browsers not yet supported all this new types.

With autofocus you tell to browser go to this input when a page is loaded.

With required you tell to browser to check automatically if that field is filled before send the form to server.

Placeholder is like a hint, but this text is showed inside the input and the browser erase automatically when the user insert values.

And finally, with pattern you can define a regular expression to validate the data automatically. The example above you can see a regular expression to validate the email.

It is a little part of new features. I suggest visiting w3schools.com and learning more!

28 Comments :, more...

Nowadays – Big files from e-mail. You can!

by on Dec.24, 2011, under Web

Nowadays I’m working in a PHP application to “send” big files from e-mail. But this web application will provide a mechanism to upload the file, send an email with download information, and finally provide a link to download the sent file.
It is very simple and free!

My goal is publish the Alfa version in January/2012.

PS: I’m looking for Web Design to work in visual identity.

9 Comments :, more...

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Archives

All entries, chronologically...