FRIHOST FORUMS SEARCH FAQ TOS BLOGS COMPETITIONS
You are invited to Log in or Register a free Frihost Account!


Portable web design/development workstation guide





bogisha
You are a web designer or developer? You work on multiple computers? You have an old USB thumb drive you don't use?
Why don't you make a portable web design/developing workstation and keep your projects always with you.

In this little guide i'll help you do that. I use this for couple of months and it is great. All software included in this guide is free of charge so anyone can use it.

Step 1.

First we need an operating system that will run directly from an USB stick. My choice is Porteus, it is free linux operating system designed for USB sticks and it is only around 200 MB, so 1GB USB stick will be just fine.

Download Porteus from here:

http://www.porteus.org/downloads.html

Current version is 2.0 and there are two editions: 'Standard' and 'XFCE'. The difference between them are in desktop environment and few software that comes with destop environment. I choose Standard 32-bit edition.

After you downloaded Porteus, extract the iso file on USB Stick using your prefered archive tool. Contents of an .iso file must NOT be in any subfolder on USB stick.

After extracting go to "boot" folder on USB stick and run installer. If you are running windows, run installer for windows, and for linux users there are installer for linux. Follow installer instructions.

When Installation is finished, reboot your computer, enter the bios menu and set USB to primary boot device and then reboot again.

When Porteus boot menu appear choose 'Graphic mode (Razor)' and press 'enter'. Press 'enter' again when asked.

After that you should be inside your new portable OS and that should look like this:



Step 2.

First thing you should do when enter Porteus first time is to set "save file". It is a file where all your changes to the system and your data will be stored.
Go to Porteus menu (bottom left corner icon, similar to windows start button), then choose 'system tools' and then 'Porteus save file manager'. User is 'root' and password is 'toor' by default.
Then click on 'Create' button next to 'I want to create new save file'.
In next window enter file name and size in MB, you can leave it on 512 or if you have more space on your USB stick you can increase it. This file can be resized later. Then click on folder icon next to 'Location' and find folder which is your USB stick (mine is 'sdb'). Content of folder should look like this:



Enter 'porteus' folder and click ok.



Leave advanced options untouched and click ok. Wait for program to finish.


When you recieved message like this:



Note down location of the file from the message and go to your USB stick, enter 'boot' folder, then 'syslinux' folder and open porteus.cfg file (right click > open > leafpad).
Find this line

Code:
APPEND initrd=initrd.xz changes=/porteus


and edit it so the changes point to your save file like

Code:
APPEND initrd=initrd.xz changes=/mnt/sdb/porteus/porteussave.dat


(change to your location if different)

Save file and reboot your computer. If you are not asked to press 'enter' while booting like first time, your save file is configured successfully.

Step 3.

Now it is important to configure internet connection. If you have wired connection like DSL, it should be enabled by default, just turn on your modem and skip to the next step. For WiFi and Mobile broadband click on connection icon in lower right corner somewhere next to clock and see available options. This is different from user to user so i can't describe it now, if you have problems with connecting ask for help in comments.

Step 4.

Now we should start installing software. The software most of web developers/designers need are browsers, localhost server, Image editor, advanced text editor, FTP client...

Porteus 2.0 comes with GIMP 2.8 by default which make job easier. You can find it in 'Porteus menu > Graphics > Gnu Image Manipulation Program'.

Porteus 2.0 also comes with Firefox web browser by default. If you need another browser you can install Chromium (Google Chrome open source alternative, actualy Google Chrome is based on Chromium), or Opera. Other two major browsers IE and Safari are not available for linux platform.

To install Chromium go to Porteus menu, then choose 'System tools' and run 'Porteus package manager'. Enter password 'toor' and click ok button. Once in Package manager, click on 'Porteus' button, then click on category above it. In category menu click on 'Network', find Chromium package, double click it and hit 'Get it now' button. wait for resolving dependancies and click 'Download now' button. Wait for download to finish and click 'Activate now' button (you can also merge modules for later use, but merging larger number of modules can take forever).

You can install Opera browser same way like Chromium.

There are also a bunch of minor browsers like Midori, Arora, Seamonkey...

For web server i use XAMPP for linux. You can download it from here:

http://sourceforge.net/projects/xampp/

I'm using XAMPP 1.7.7, newer versions have new security concept which i didn't have time to test. If you want latest version look here for help with new security concept.

After downloading open Terminal (Porteus menu > Accessories > LXTerminal). Then switch to root user by entering command

Code:
su


Enter password (toor) and press 'Enter'. Then move to Downloads folder (if you save XAMPP in Downloads)

Code:
cd /home/guest/Downloads


and enter comand for installing XAMPP

Code:
tar xvfz xampp-linux-1.7.7.tar.gz -C /opt


If you downloaded newer version change file name in command above. That's it, you installed server. Now you can start server with command

Code:
/opt/lampp/lampp start


and you will get this message

Code:
Starting XAMPP for Linux 1.7.7...
XAMPP: Starting Apache with SSL (and PHP5)...
XAMPP: Starting MySQL...
XAMPP: Starting ProFTPD...
XAMPP for Linux started.


Open browser and go to http://localhost to test your server. You should get something like this:



After installing XAMPP delete installation file from your 'Downloads' folder or move it somewhere else to preserve space on your USB stick

Porteus 2.0 already have FTP Client. You can find it in Porteus menu > Internet > gFTP. If you wish to install FileZilla you can do it with 'Package manager' just like browsers.

You can also find a nice editor in Porteus menu > Office > TEA. Or you can look for bunch of others in 'Package manager', i suggest 'Geany' or 'Bluefish' editors.

Step 5.

Just one more thing, since your storage in portable systems is limited to the size of your USB Stick, you should connect to your Dropbox to keep files online just in case.

For those who don't have Dropbox account, it is free cloud with 2GB+ storage capacity. You can use my referral link to sign up so both of us recieve 500MB of storage gratis. Here is the link

http://db.tt/1kuK0dqf

After you sign up download dropbox client from here:

http://slack.isper.sk/pub/slackware-14.0/network/dropbox/1.2.49/dropbox-1.2.49-i686-3sl.txz

Save it to 'Downloads' folder. When file is downloaded open terminal and become root:

Code:
su


then navigate to 'Downloads' folder

Code:
cd /home/guest/Downloads


and finaly run installation command:

Code:
installpkg dropbox-1.2.49-i686-3sl.txz


After installation go to 'Porteus menu > Internet > Dropbox' and follow instructions to set up.

Step 6.

Change wallpaper to something badass and enjoy using your new portable web developing/design workstation. Feel free to explore more stuff in Porteus.

For the sake of keeping this post as short as possible maybe i didn't write detailed instructions on every step. If you get stuck on any step ask in comments for help, or join Porteus forums (http://forum.porteus.org) they are very friendly and helpfull community.
cybersa
Good Tips.
Useful for web designer.

Also depend on his/her development area or interest they can make his/her own pendrive like Android App Development,compiling os tool,hacking tools etc....
bogisha
cybersa wrote:
Good Tips.
Useful for web designer.

Also depend on his/her development area or interest they can make his/her own pendrive like Android App Development,compiling os tool,hacking tools etc....


Yes, of course. Possibilities are much bigger than this, but i made it for we designers because it is my closest interest, and since this is community full of web programmers/designers i decided to make it this way.

I also use porteus for data backup on broken systems, recovering lost partitions and security scan. Maybe when i have time next time i'll write guide on that topic. Cheers!

Bogdan
LxGoodies
hi @bogisha,

Very nice litle playbox you present here ! Thx !

Lx
johans
nice information. I should try this if i have time.
Related topics
Reply to topic    Frihost Forum Index -> Computers -> Operating Systems

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2011 Frihost, forums powered by phpBB.