Website Tech

Tag: Xampp

  • Configuring XAMPP for Multiple Web Sites

    To use XAMPP for developing multiple web sites, specify a ‘host name’ for each web site to use. Each web site will have its own folder on your computer. Link a host name, to a folder with your web site files. Edit the web site files, view them on your web browser (skipping the normal FTP step for each change); when the page is working, publish it to the Internet.

    You can define your own host names. Some people use .local for their naming convention (http://www.yourdomain.com on the Internet, http://www.yourdomain.local on your development computer). Or use local.yourdomain.com, which should be looked for on your computer before on the Internet. I like a simpler one, since I’m doing it only for me: yd.c (Yes, you can name it anything you want, on your own computer only). Two or three letter abbreviation, and .c, you’d be amazed how typing 4 characters instead of a long domain name, again and again, matters in developing and testing a web site.

    You define “your own host name” in two places, one for XAMPP, one for Windows. (more…)

  • Web Site Development Tools (Windows and OS/X)

    Web Site Development Tools (Windows and OS/X)

    You really should use an FTP program. (No, don’t use your web hosting company’s HTML file browser. Not as fast, easy, reliable. Also, don’t edit plugin or theme files using WordPress built-in editor, you need a programmers editor, and then FTP.) Windows FileZilla or FileZilla Portable; OS/X FileZilla Client or just search for FileZilla on download.cnet.com, it’s completely free and well done. Find out from your hosting provider if you can connect securely (SFTP is most common).

    If you don’t already have a good programmers editor, get Notepad++, Notepad++ Portable, or for OS/X TextWrangler or BBEdit look like good choices (but I haven’t used either). TextWrangler vs BBEdit Comparison. Both are from the same company, so get TextWrangler (free) until you know you Need a feature in BBEdit.

    I have clients who use CoffeeCup Free HTML editor, or who have purchased the full version. Very nice. I haven’t used their other tools, I either already had free tools that work great, or wasn’t interested, but those tools all look well done. http://coffeecup.com/

    Having a development server lets you put only working pages on your public web site. I use XAMPP, a full free Apache server, with PHP, Perl, MySQL, and more, to run on your Windows computer. Even a portable version (install on a USB drive, have a web site development server on any Windows computer). Changes the development flow; instead of making updates with edit-upload-refresh browser-repeat, updates become edit-refresh browser. Small change, but it really adds up. Plus of course, it enforces developing and testing on one server, putting the working product on the production server. Develop WordPress plugins on your notebook, without crashing your production WordPress multi-site setup with 30 client blogs.

    If you want a full professional HTML/PHP/Javascript development environment with debugger, I’ve used NetBeans IDE and like it. Versions for Windows, OS/X and others. Get the “PHP Bundle” unless you know you are going to use other languages; you can always “add or remove packs later using the IDE’s Plugin Manager (Tools | Plugins)”. But unless I am working on something where stepping through the code to find bugs is what I need to do, I find I use NotePad++ most, perhaps just because I learned it first.

    For website development you have to have Firefox, with the Firebug addon. And it’s really good to have Google Chrome too, there are occasional CSS slight differences; mostly I’ve found I was sloppy with CSS sometimes, Chrome would show my sloppiness where Firefox would interpret my CSS to do what I meant. Chrome has the developer tools built in (the Inspector), that look a lot like Firebug; both let you see all the CSS statements are loaded for the element, which are over-ridden vs active, and adjust the CSS until you see the results you want. Both have a lot more, and that’s the feature you’ll use every time something on any page doesn’t look right.

    (I don’t use Internet Explorer except occasionally I quickly check my site displays in an older version; IE9 came on my new computer. Any version of IE older than that gets the same standards compliant, responsive, minimal HTML, formatted by CSS web site that I give to any smart phone, plus a very small IE-specific CSS file that makes it display simply; anyone using old IE today is used to web pages not looking great.)

    I use the Fireshot plugin for screen captures, Firefox/Chrome/IE. Excellent for communicating technical visual things with other people.

    Check out Xplorer2 for file browsing, much easier to have two panes in a single window, than using Windows Explorer. Use bookmarks for your favorite folders, instead of endlessly navigating up and down the tree of folders. (on download.cnet.com)

    For images, I use IrfanView for viewing and minor edits such as cropping and color balance. GIMP is the best free image editor; I barely know how to use it for simple things; graphic artists compare its features to PhotoShop.

    For keeping all my passwords for all those sites and banks and stores, settings for FTP sites, settings for databases, etc, I use KeePass Portable (on download.cnet.com)

    GMail and Google Hangouts have custom email accounts for free, view email from any web browser, forward GMail messages to any POP or IMAP account (e.g. on Thunderbird). Google Hangouts is connected to a GMail account, chat audio or webcam audio/video. Screen sharing, if you do any technical support you can guide the other person as you watch their screen. Completely free calls to any USA phone number.

    VLC Media Player: http://videolan.org/vlc excellent media player capable of reading most audio and video formats.

    7 Zip: http://7-zip.org An open source, free alternative to WinZip, has higher compression, great integration with Windows Explorer or xplorer2.

    Adobe Reader: http://get.adobe.com/reader the standard free PDF viewer.

    Audacity: http://audacity.sourceforge.net for recording & editing audio files, a lot of professional-level multi-track editing capabilities. Easy for trimming audio (e.g. the long pause from starting recording to start of talking), and making people who talked at different volumes sound the same. Open source.

    Evernote: http://evernote.com Scan your notes, receipts, etc, will OCR the content, save it, and make it searchable. Free.

    GIMP: http://gimp.org (free download)
    An open source program used to create & edit – free alternative to Photoshop.

    Open Office: http://openoffice.org (free download)
    Open source office suite software – word processing, spreadsheets, databases, presentations. Reads .csv files better than Microsoft Office (if a text field has multiple lines, MSOffice can’t read it).

    Panda Cloud Antivirus (download.cnet.com) or AVG: http://free.avg.com (free download)
    Anti-virus and anti-spyware protection.

    BrowserShots: http://browsershots.org (free online tool)
    Use this to see how your website look in various browsers, browser versions, operating systems.

    Other Software, Others Recommended

    CamStudio: http://camstudio.org (free download)
    Lets you record all screen & audio activity on your computer and create video files.

    CCleaner: http://ccleaner.com (free download)
    Removes unused files from your pc allowing Windows to run faster and freeing up space.

    Color Cop: http://colorcop.net (free online tool)
    A multi-purpose color picker – great for web designers and programmers.

    Down For Everyone: http://downforeveryoneorjustme.com (free online tool)
    Is your site down? Use this tool to see if your website is down for other people.

    DupeFree: http://dupefreepro.com (free download)
    Quickly check for duplicate content & LSI keywords.

    Give Away Of The Day: http://giveawayoftheday.com (free download)
    Unique site that offers you a free license digital product daily.

    Launchy: http://launchy.net (free download)
    Opens your documents, project files, folders, and bookmarks with just a few keystrokes .

    NicheBot Classic: http://nichebotclassic.com (free online tool)
    Online keyword research tool helps you target the correct keywords.

    OSWD: http://oswd.org/ (free downloads)
    Open Source Web Design offers free web design templates.

    PDF995: http://pdf995.com (free download)
    Use this tool to easily convert files to PSD format.

    PDF to Word Converter: http://pdftoword.com (free online tool)
    Easily create editable Word Doc files from PDF content – for legit purposes only! 🙂

    Pixie: http://nattyware.com/pixie.php (free download)
    Great for web designers – just point to a color and it will tell you the code value for that color.

    Private Label Rights Forum: http://resell-rights-weekly.com/forum (free online tool)
    Very helpful forum with lots of good info on internet marketing. Friendly members too.

    Resell Rights Weekly: http://resell-rights-weekly.com/ (free downloads)
    Free membership where you can download over 150 PLR/RR products for free.

    Roboform: http://roboform.com (free download)
    Easily & safely manage your passwords.

    ScreenHunter: http://wisdom-soft.com/sh/sh_free.htm (free download)
    Software that allows you to “capture” any part of your desktop, a window or full screen.

    ShortKeys: http://shortkeys.com (free download)
    Allows you to set up replacement text or paragraphs for any user defined keystrokes.

    SpyBot: http://safer-networking.org (free download)
    Effectively detects and removes spyware from your PC.

    Textpad: http://textpad.com (free download)
    A powerful text editor, for editing HTML code.

    TimeLeft: http://nestersoft.com/timeleft (free download)
    A countdown, reminder, clock, alarm clock, stopwatch, timer, & web countdown tool.

    Tweet Deck: http://tweetdeck.com (free download)
    Great for staying in touch with your contacts across Twitter, Facebook, MySpace and more.

    Kompozer: http://kompozer.net (free download)
    An easy to use WYSIWYG HTML editor. Less buggy than NVU (the project was picked up where NVU left off). But doesn’t know anything about PHP, won’t even open a PHP file (copy/paste results into your PHP file, in NotePad++.) As of 9/1/2013: “Latest development version: 0.8b3 (2010-02-28)”, so the project has halted. I recommend get the CoffeeCup Free HTML Editor, which displays the preview in a portion of the screen. Or if you really want to have WYSIWYG web editing, use WordPress!

  • Xampp directory mismatch

    If you unzip the Xampp files (e.g. into c:\xampp) the installer doesn’t know where the installed files went.  You will see in the Xampp Control Panel Application (xampp-control.exe) a message “directory mismatch”.

    This doesn’t matter for normal operation of Xampp, but if you try using the installer for Xampp add-ons (for example, Perl), you can’t proceed.  You can, however, simply use the .zip version of Perl, and manually install it in the c:\xampp folder (or whatever other folder you used).

    There isn’t a file that I could find that stores the installation location.  The xampp-control only checks the Windows Registry. If you prefer to have the installation file recorded, use the following steps:Open the Windows Registry Editor (Start, Run, regedit)

    Navigate to HKEY_LOCAL_MACHINE\SOFTWARE
    Right-click on SOFTWARE and select New Key. Type XAMPP then click OK.  Right-click the XAMPP Key you just created, and select New, String Value. Name it Install_Dir (probably case sensitive!) then hit Enter. Double click this value and in the appropriate box, type the path of your current XAMPP installation (C:\xampp usually). Close the Registry Editor.

    Restart the Xampp Control Panel and you’ll see the installation directory has been properly set.   You can now install your add-ons.

  • Xampp with Skype

    Make this change to Skype configuration to allow Skype and Xampp to work together (from http://www.apachefriends.org/en/faq-xampp-windows.html#startpage ):

    If Apache doesn’t start while Skype is running, change the settings on Skype to not use port 80.  Skype’s Tools, Options, Connection tab, uncheck “Use port 80 and 443 as alternatives for incoming connections”.

  • PHP Development on your laptop

    Setting up a PHP development environment

    Setting up my laptop to be a PHP/MySQL server was easier than I would have predicted. Download the XAMPP package from Apache Friends at http://www.apachefriends.org and unzip it to c:\xampp (keeping the folder hierarchy intact). There are Windows and Linux versions, with Mac OS X version being developed. I’m writing about the Windows version.

    Run c:\xampp\setup_xampp.bat and you have a functioning web server. Start it by loading c:\xampp\xampp_start.exe and you can load http://localhost/xampp/ in your web browser. The //localhost root is c:\xampp\htdocs

    To have Xampp run automatically, set it up as a Windows Service. Run c:\xampp\xampp-control.exe and put check marks next to Apache and MySQL.

    Xampp Control Panel

    Since any PHP developer is likely to develop multiple websites, make a subfolder of htdocs for each website. There are some simple changes to make so each subfolder works as a subdomain (i.e. html links to /images work as expected for the site). Edit your C:\xampp\apache\conf\extra\httpd-vhosts.conf adding lines like the following (substitute your folder name instead of lernerc):

    <VirtualHost local.lernerc.com:80>
    DocumentRoot “C:/xampp/htdocs/lernerc/”
    ServerName local.lernerc.com
    ServerAdmin youremail@yourserver.com
    <Directory “C:/xampp/htdocs/lernerc/”>
    Options Indexes FollowSymLinks
    AllowOverride FileInfo
    Order allow,deny
    Allow from all
    </Directory>
    </VirtualHost>

    If you have a site in c:\xampp\htdocs\ot, you would use lines like this:

    <VirtualHost local.ot.com:80>
    DocumentRoot “C:/xampp/htdocs/ot/”
    ServerName local.ot.com
    ServerAdmin youremail@yourserver.com
    <Directory “C:/xampp/htdocs/ot/”>
    Options Indexes FollowSymLinks
    AllowOverride FileInfo
    Order allow,deny
    Allow from all
    </Directory>
    </VirtualHost>

    Then you need to tell your operating system about new “domains”. In Windows, edit the C:\Windows\system32\drivers\etc\hosts file with lines like this:

    127.0.0.1 local.lernerc.com
    127.0.0.1 local.ot.com