Wednesday 21 June 2017

How to website from XAMPP on one computer to XAMPP on another computer?

How to website from XAMPP on one computer to XAMPP on another computer?

I normally use XAMPP for web development on my local Windows machine. And I needed to move the website files from one computer to another as I have a new Windows laptop on which I would be doing my web development activities from now on. So, I needed to move the existing website files from the older computer to the new computer, along with the database of the website. If you are in a similar situation, refer to the steps below how to move the websites from XAMPP on one computer to XAMPP on another computer

XAMPP is a free and open source cross-platform web server solution stack package developed by Apache Friends, consisting mainly of the Apache HTTP Server, MariaDB database (supports MySQL) , and interpreters for scripts written in the PHP and Perl programming languages.
  • X = Cross Platform / Any Operating System
  • A = Apache Web Server
  • M = MySQL / Maria DB
  • P = PHP Programming Language
  • P = Perl Programming Language
XAMPP is easy to install and packages all the above requirements of web development out of the box. There is minimal configuration required to kick start web development on local machine instead of installing all the above requirements manually. 

How to move websites from XAMPP on one computer to XAMPP on another computer. 

Assumptions / Pre-Requisites:
So, I have been using XAMPP for web development on my local computer. I use WordPress and Drupal mostly, but there are some custom PHP sites too. In this post, I will be using one of the WordPress CMS site for the purpose of illustration in this post. On my system, XAMPP is installed at C drive at C:/xampp. Thus, website files are located under C:\xampp\htdocs directory.

For the steps explained below, it is assumed that XAMPP is installed on both the computers already.

Steps to move websites from XAMPP on one computer to XAMPP on another computer. 
This method is not only for WordPress shown in this example. It can be used for any other CMS or sites. The basic process in a nutshell is to move the website folder to the new computer under the same folder, that is under C:\xampp\htdocs and move the database to the new computer

1) Move website files from computer 1 to computer 2:
  • Copy the website folder you want to move from C:\xampp\htdocs\. For this example, the website folder to be copied is "techblog". Thus, I copied the folder C:\xampp\htdocs\techblog
  • Move the website folder from the computer 1 to C:\xampp\htdocs\ on the computer 2 using any medium. For this example, the website folder copied is "techblog". So, we should have the website files in C:\xampp\htdocs\techblog. 
That is all that is required as far as moving the website files from one computer to another for using with XAMPP is concerned.

2) Export database of the website from computer 1
  • Open phpMyAdmin in a browser on computer 1 by accessing http://localhost/phpmyadmin
  • Login to phpMyAdmin if a password is set for root
  • Select the  database from the left sidebar of phpMyAdmin
  • Click on STRUCTURE and check how many tables the database has. It is displayed at the bottom of the STRUCTURE page. Compare  the number of tables during import on computer 2.
  • Now to export, click on EXPORT tab
Note: For some CMS (such as Drupal, WordPress etc.) it is recommended to clear cache from the admin interface before exporting database to avoid any import issues and/or site issues after import.
  • Keep default settings and just click "GO" to export and download the database.
  • An SQL file will be exported. Save it to computer 1

 3) Import the exported database from computer 1 into computer 2 
  • On computer 2, access http://localhost/phpMyAdmin and login if a password is set.
  • Once logged in to phpMyAdmin, click on "databases" and create a new database. 
  • You can name the database whatever you want but preferably keep the same name so that settings need not be changed.
  • Select the new database from the left sidebar
  • Click Import.
  • Click on the "Browse" button and locate the database we exported from the old computer.
  • Keep default settings and just click "GO" to import the database.
  • Once the database is installed, check the website on computer 2 by accessing http://localhost/techblog. If the database name was kept the same during new database creation on computer 2, there is no need to change database name in the website settings file.
Database import issues? 

Unable to import database into phpMyAdmin due to an error?
If this is a new  XAMPP installation on the new computer without any setting changes so far, then the database might not have uploaded due to size limit. In that case, upload size need to be changed in php.ini file on computer 2.

Error: No data was received to import. Either no file name was submitted, or the file size exceeded the maximum size permitted by your PHP configuration
If you are unable to import database into phpMyAdmin due to the above error, you would need to edit some settings in php.ini configuration file at C:\xampp\php\php.ini.

  • Open php.ini in a notepad, preferably Notepad++ and edit the values of the following parameters. I increased the following parameters to:
post_max_size = 50M
upload_max_filesize =50M
Since it is a development environment, you can set it to any reasonable value. On live server, these parameters will usually be controlled by your web host service provider. and you may not have access to php.ini. 
  • After changing the values of the above parameters, restart Apache from XAMPP control panel.
  • Retry the import of SQL database into phpMyAdmin. It should be resolved now.

How to prepare the SQL database file before import if the XAMPP on the previous computer was using another port for such as "localhost:8080" instead of the default "localhost"
If on the previous computer 1, XAMPP was set to use "localhost:8080" instead of "localhost" to access web pages but on the new computer it is using the default "localhost" to access web pages, then the website on computer 2 will not work properly as the database has referenced to "http://localhost:port-number/websitename". Sometimes, people have multiple web servers on a single computer such as IIS and Apache from XAMPP. In that case, the default HTTP port 80 may already be used by the other web server. So, Apache is assigned another port to use.

We can edit the URLs containing the "localhost:8080" from phpMyAdmin with simple SQL querries but I find it easier to edit it using text editors by using simpler "find and replace" feature. We can find all reference of "localhost:8080" and replace them with "localhost" only. For this purpose Notepad++ is good instead of Notepad.
  • Open the databasename.sql exported from the previous XAMPP in a Notepad or Notepad++
  • Press CTRL+F and search for "localhost:8080". You should be able to see some results.
  • Now replace all instances of "localhost:8080" with "localhost" by doing replace all.
  • Save the edited SQL file or "Save As" with a new name
  • Use this edited SQL file in the phpMyAdmin import (described above).