GoodTodo PHP and SQlite App

I really like to keep track of tasks and projects (personal or otherwise) I work on. I used to keep my todos list in notepad or by using some other sticky notes application but I wanted dead simple todos app with beautiful looks and simple to use without irrelevant options or goodies. So here I introduce GoodTodo; a todo app made via PHP and SQlite. I chose SQlite because I wanted to make sure that app is portable and of course since it’s small todo app, choosing SQlite for it makes perfect sense. I have used flightPHP framework and idiorm ORM for it.

Here are its screenshots:

localhost todo home localhost todo settings localhost todo categories

 

How to use:

Make sure you have wamp/xampp or other stack installed. Download the app and put in www/htdocs folder and browse to that folder via browser something like http://localhost/todo. Please make sure you have sqlite extension turned on from php.ini if it isn’t already.

So go ahead and download GoodTodo to keep track of your todos.

 

Save Complete HTML Pages with Pure PHP

screenshot

In order to save complete pages along with all resources such as images, styles and scripts, you could use your browsers, however browsers also save accompanying files in separate folder. For example if you wanted to save some page called sample, browser would save the complete page along with folder named sample_files. Browsers also have their proprietary formats such as MHTML (Mime HTML) for Internet Explorer or MAFF (Mozilla Archive Format) for Firefox but with these you are limited to opening these files in these browsers only which isn’t good or always ideal.

It would be good if one could save all resources of an html page in a single file which can be opened by all browsers which is the html format itself. In order to achieve that, I have created a class that helps you save entire page in a single HTML file along with all its resources, no side folder created, all images, CSS and scripts reside in that single html file which of course can be opened in any browser.

This allows really cool possibilities such as creating your own app allowing to save complete html pages like evernote, creating browser extensions for the same purpose or saving your favorite pages to cloud and more you can put the class to your best use and needs :)

Download Class at PHPClasses

Don’t forget to rate the class :p

My Local Development Workflow with WAMP/XAMPP, GIT and Google Drive

I like to share my local development workflow which has turned out to be extremely useful in that all my projects’ files are versioned and on the cloud. I use git to keep my files versioned and Google Drive so that I can access my projects anywhere. In this post, I will share really cool stuff that you definitely should consider implementing for your own projects.

If you don’t know about git and its benefits, there are numerous compelling reasons why it is useful, you might want to check out:

The benefits of keeping all my files and projects on the cloud like Google Drive should be obvious but if you are still not sure, check out:

Although there are many other cloud storage services such as Microsoft SkyDrive, Dropbox, Box, Bitcasa, etc but I chose Google Drive since it gives 10GB of free space which should be enough for my development needs. If that’s not enough for you, you can create another Gmail account and get another 10GB free. You might want to read their usage policies too if you want.  You may also consider using Bitcasa which gives you unlimited space but since it is new, I can’t personally trust it as yet.

Installing Google Drive

Step 1: Create a new Gmail account to be used with Google Drive client software. Although you can use your existing account but it is good idea to create a new one used for your projects’ backup only.

Step 2: Download Google Drive from here or here. During the installation, you would be asked to specify the folder path which will be synchronized with Google Drive. Make sure that you specify a folder present on any drive other than your OS drive so that even if your system crashes or corrupts, your projects remain intact. For example, I have that folder on path D:/Google Drive/

Step 3:  Once installed, run Google Drive software and specify the credentials of your newly created Gmail account.

Using Google Drive with WAMP/XAMPP

Now that we’ve setup google drive, it is time to setup document root to google drive folder and create virtual host. This would allow you to run your local projects through WAMP/XAMPP from google drive folder. The reason why we do this is that since google drive folder will be sync by google drive software, any project we put in that folder will automatically be uploaded in your google drive account.

Note: I am using XAMPP but if you are using WAMP, some settings or file paths might be different, you should consider reading its documentation.

Step 1: Inside your google drive folder, create a new folder named webroot making whole path X:\Google Drive\webroot where represents your drive letter.

Step 2: Assuming you have specified google drive folder to be  D:/Google Drive/, open httpd.conf (normally located at apache\conf folder) file in notepad or other text editor and find the line Include “conf/extra/httpd-vhosts.conf”. If there is a hash (#) before that line, remove it. Now find the line with <Directory /> and you should see something similar to:

<Directory />
 AllowOverride none
 Require all denied
</Directory>

Change Require all denied  to Require all granted

Or if you see something like:

<Directory />
    Options FollowSymLinks
    AllowOverride None
    Order deny,allow
    Deny from all
</Directory>

Change it to:

<Directory />
    ........
    Allow from all
</Directory>

Now come to bottom of the file and add:

<Directory "D:\Google Drive\webroot">
  Options Indexes MultiViews
  Order Allow,Deny
  Allow from all
</Directory>

Save the file and close it.

Step 3: Open httpd-vhosts.conf (normally located at apache\conf\extra folder) and add these lines at the end of it:

<VirtualHost 127.0.0.1:80>
    DocumentRoot "D:/Google Drive/webroot"
    ServerName gdroot.loc
    ServerAlias gdroot.loc
    ErrorLog "D:/Google Drive/webroot/logs/error.log"
    CustomLog "D:/Google Drive/webroot/logs/access.log" combined
</VirtualHost>

Save the file and close it. Notice that we have specified gdroot.loc as address which actually means google drive root (.loc signals that it is local folder) which actually maps to your google drive webroot folder eg D:/Google Drive/webroot. Notice that you could name it anything you want like mycoolwebsite.com, yourname.com, etc but of course that is local folder running from your own computer.

Step 4: Open hosts file in notepad or other text editor located at X:\Windows\System32\drivers\etc where stands for drive letter where your OS is installed. At the end of that file add this line assuming you specified URL in above step as gdroot.loc:

127.0.0.1       gdroot.loc

Or if you also use port to access your LAMP/XAMPP URLs, specify that as well:

127.0.0.1:PORT_NUMBER_HERE       gdroot.loc
Note: If you can’t edit hosts file, you need to have file owner permission, search on google how to do that.

Restart apache and access the new url by typing gdroot.loc in your browser. You should see screen similar to when you go to http://localhost.

Congratulations ! you have a nice workflow now. You can now put all your existing our new projects inside your new document root which was assumed to be located at D:\Google Drive\webroot and now all your projects are sync with google drive and automatically uploaded to your google account which you can access anywhere. For example, you can now access your projects at office or any other computer by installing google drive client software  there and telling it sync/download your webroot folder. Your projects are now always there and backed up on the cloud :)

Let’s take cool stuff one step further by using git so that our projects file are also versioned. If you don’t know much about git and its benefits consider reading links posted above or below in the Git Resources section.

Using Git with a Central Repository

Creating and using central repository is especially useful in a team. If you just want to keep your projects versioned and are the only developer working on a project, the normal flow is (unless you track your project to remote host such as github):

  • modify files
  • commit your changes
  • repeat

So essentially you can skip this section if you just want to version your project files and are only developer working on a project.

Step 1: Download msysgit from here, choose first link from there. Install it with default settings.

Step 2: Go to your google drive folder (D:\Google Drive\) and create a new folder there named central.git

Step 3: Right click on newly created folder and choose Git Bash Here and type: git init –bare

Step 4: Create a test project folder named myproject inside your normal WAMP/XAMPP webroot/htdocs folder or google drive webroot folder mentioned above (Although you can git-manage any folder anywhere on the drive but naturally we want to git-manage projects that we run from webroot/htdocs folder).

Step 5: Right click on newly created folder, choose Git Bash Here and issue these commands one by one:

git init
git remote add central /e/Google\ Drive/central.git/
git push --all central
git push --set-upstream-to central master

Great! now we’ve setup central repository for all our git-managed projects and we can commit, push, fetch all changes from that central repository. For any new repository, you can now issue commands like:

git clone /e/Google\ Drive/central.git/
git fetch /e/Google\ Drive/central.git/
git push central
and so on

Hope you liked the post and have fun !

Git Resources