Monthly Archives: June 2016

Download and Install XAMPP

Today we cover What is XAMPP, Why use XAMPP, How to Download and Install XAMPP, Basic Web server configuration

What is XAMPP?

XAMP is a open source free cross platform web server. It’s maintained and compiled by apache. The XAMPP stands:

  • X – [cross platform operating systems] meaning it can run on any OS Mac OX , Windows , Linux etc.
  • A – It stands Apache – this is the web server software.
  • M – It stands MySQL – Database.



  • P – It stands PHP
  • P – It stands Perl – perl is scripting language

Why use XAMPP

  • In order to use PHP, you will need to install PHP
  • XAMPP provides an easy to use control panel to manage MySQL, Apache and other programs such as filezilla, Tomcat etc.

How to Download and Install XAMPP

We look into step by step process to install XAMPP for Windows. For Other Operating Systems, installation steps are similar.

  • Step 1:Install XAMPP from http://www.apachefriends.org/en/xampp-windows.html. Download the XAMPP package from this url and install.
  • Step 2:Installation XAMPP is just like installing any other windows program. There are however, a few things that we must note.
  • Step 3:After you have downloaded XAMPP, run the setup. The warning message dialog window shown below appears.
  • xampp1



  • Step 4:
  • xampp2

  • Step 5:After you have deactivated the User Account Control, click on OK button on the warning message box.
  • Step 6:This time you get following message
  • xampp3




  • Step 7:In the succeeding screen, click next
  • xampp4







  • Step 8:In the next screen, Change the installation path if required. Click Next
  • xampp5



  • Step 9:In the next screen select Apache and MySQL. You may optionally select FileZilla (FTP Client) if needed. Click Install
  • xampp6

  • Step 10:On successful completion of installation, you will see following window
  • xampp7



  • Step 11:Click on Finish button.

Basic Web server configuration

xampp_directories

  • htdocs: All the PHP code written in htdocs directory. This is the web root directory.
  • mysql: This directory contains all the information related to MySQL database.
  • php: This directory contains PHP installation files. It contains an important file named php.ini.

XAMPP Control Panel

  • Click on start menu.
  • Explore the programs directory and locate Apace Friends then XAMPP as shown in the diagram below.
  • xampp_control_panel1

  • The diagram below shows the control panel.
  • xampp_control_panel2



Configure XAMPP

configure_xampp



If anyone has doubts on this topic then please do let me know by leaving comments or send me an email.

Difference between DELETE, TRUNCATE and DROP commands

Good Morning to all,
In here, I share the article related to delete, truncated and drop command. We cover basic concept of these three command, syntax, simple example in this post.



DELETE

If you want to remove the rows from a table the DELETE command helps to perform this operations. DELETE is a Data Manipulation Language (DML).
In DELETE command we use WHERE clause, it can be used to only remove some rows. If there is no WHERE clause,then remove all rows. After performing a DELETE operation you need to COMMIT or ROLLBACK the transaction to make the change permanent or to undo it.

Syntax of a SQL DELETE Statement


DELETE FROM tablename [WHERE condition];

To delete all rows


DELETE FROM tablename

OR





DELETE * FROM tablename

Note:tablename — the table name which has to be updated. WHERE clause is optional in DELETE command.

Example


SQL> SELECT COUNT(*) FROM employee;

COUNT(*)
----------
18

SQL> DELETE FROM employee WHERE position = 'developer';

5 rows deleted.

SQL> COMMIT;

Commit complete.

SQL> SELECT COUNT(*) FROM employee;

COUNT(*)
----------
13





TRUNCATE

TRUNCATE helps to remove all the rows from a table.
The operation cannot be rolled back and no triggers will be fired. TRUNCATE is a Data Definition Language( DDL).

Syntax to TRUNCATE a table:


TRUNCATE TABLE tablename;

Example


SQL> TRUNCATE TABLE employee;

Table truncated.

SQL> SELECT COUNT(*) FROM employee;

COUNT(*)
----------
0

DELETE vs TRUNCATE

DELETE TRUNCATE
It’s a DML command It’s a DDL command
DELETE removes some rows if WHERE clause is used Removes all rows from a table, but the table structures and its columns, constraints, indexes remains.
Removes Some or All rows from a table. Removes All rows from a table.
Can be rolled back Cannot be rolled back
Does not reset identity of the table Resets the identity of the table.
A WHERE clause can be used to remove some rows. If no WHERE condition is specified, all rows will be removed. Does not require a WHERE clause, so you can not filter rows while Truncating.
Triggers will be fired. No Triggers will be fired.
The WHERE condition is optional Cannot use WHERE condition

DROP

The DROP command removes a table from the database. All the tables’ rows, indexes and privileges will also be removed. No DML triggers will be fired. The operation cannot be rolled back.
DROP is a Data Definition Language( DDL).

Syntax to drop a sql table structure:






DROP TABLE tablename;

Example


SQL> DROP TABLE employee;

Table dropped.

SQL> SELECT * FROM employee;
SELECT * FROM employee
*
ERROR at line 1:
ORA-00942: table or view does not exist




If anyone has doubts on this topic then please do let me know by leaving comments or send me an email.

Removing last comma in a string – PHP

Hi Guys,
Here I am going to share how to remove the last comma in a string by using php function. The rtrim() function will helps you to remove whitespaces or other predefined character from the right side of a string.



Syntax

rtrim(string,charlist)

Parameter Description
charlist Optional. Specifies which characters to remove from the string. If omitted, all of the following characters are removed:

  • “\0” – NULL
  • “\t” – tab
  • “\n” – new line
  • “\x0B” – vertical tab
  • “\r” – carriage return
  • ” ” – ordinary white space
string Required. Specifies the string to check

Example











Output is:

1,2,3,4,5

The rtrim() function removes whitespace characters from the right side of a string.

  • ltrim() – Removes whitespace or other predefined characters from the left side of a string.
  • trim() – In both sides of a string, removes whitespace or other predefined characters.
    .




If anyone has doubts on this topic then please do let me know by leaving comments or send me an email.

Live Counter using jQuery & CSS

Hi Guys,
In here, I explain how to implement live counter or increment values using jQuery. It’s very useful in your web application . It helps to show your wedsite statistics like total online users, online visitors,total post, comments etc.

Page Content

  1. jQuery
  2. HTML
  3. CSS

demo




jQuery code

The jQuery helps to live counter or increment values using jQuery. Increment the values one by one upto the limit.

	
	
	




HTML Code

In HTML code, this is used for display the counter div. And also the limit are specified in here. Upto this limit the value is increment 0 to upto given limit.

		

live Counter with jQuery

4200

Subscribers

145

Online Visitors

206

Blog posts

1380

Comments

CSS Code

CSS helps to styling the content ands div.

	
	




Full Code





Animated Live Counter demo with jQuery 







    	

live Counter with jQuery

4200

Users

145

Online Visitors

206

Blog posts

1380

Comments

Comments and feedbacks are always welcome!

jQuery vs AngularJS – Which one is better

Hi all,
Today we discuss jQuery vs. AngularJS and which one is better. AngularJS is a MVVM framework and the jQuery is a library. The jQuery is included in Angular.js file. Then we can say that,we can use the jQuery functions and features within Angular.



jQuery

All are familur with jQuery. It’s a light-weight , simple, cross-platform JavaScript library. Event handling, animations and effect used with CSS elements and developing Ajax applications can be done from the single JS file.
jQuery is a fast and feature-rich language which has a a commendable JavaScript library and a great tool for creating feature-rich websites.




So, using jQuery, we can:

  • easy DOM traversal
  • easily manipulate the contents of a webpage.
  • effects and animation
  • apply styles to make UI more attractive.
  • simple to make AJAX calls

Advantages of jQuery

  • Easy to learn, easy to use
  • Extendibility
  • Community



  • Browser Compatibility: jQuery support cross browser compatibility.

Disadvantages of jQuery:

  • Not built for larger apps
  • No out-of-the-box features to support development

AngularJs

AngularJS is best suited for the web application development . Angular is an open-source structural framework for web apps brought to us by Google, so it’s pretty solid on credentials. AngularJS is a great tool for building highly rich client-side web applications.

Advantages of AngularJS

  • Automatic DOM manipulation
  • Tenacious Testing
  • AngularJS provides data binding capability to HTML thus giving user a rich and responsive experience.
  • In AngularJS, views are pure html pages, and controllers written in javascript do the business processing.
  • AngularJS provides capability to create Single Page Application in a very clean and maintainable way.



  • AngularJS uses dependency injection and make use of separation of concerns.
  • AngularJS code is unit testable.
  • With AngularJS, developer write less code and get more functionality.
  • AngularJS provides reusable components.

Disadvantages of AngularJS

  • Steep learning curve
  • Novelty
  • Not degradable: If your application user disables Javascript then user will just see the basic page and nothing more.
  • Not Secure : Being JavaScript only framework, application written in AngularJS are not safe. Server side authentication and authorization is must to keep an application secure.

In comparison of features jQuery Vs AngularJS, AngularJS simply offers more features:

  • Localization
  • MVC-based Pattern
  • Two-Way data binding
  • Server Communication
  • Deep Linking
  • Dependency Injection



  • REST friendly
  • Full Testing Environment
  • Template
  • Form Validation

jQueryVSAngularJs

Summary




As I said in the beginning, anything jQuery does, AngularJS can do better. If you can put in the time required to get a working knowledge, Angular is all you need for complex single-page web apps. If you need to get into specifics and do not mind the increased file size, a jQuery library with extensions can help develop well-performing simple round-trip apps.

If anyone has doubts on this topic then please do let me know by leaving comments or send me an email.

JavaScript Object Notation (JSON) – Introduction

Good Morning to all,
Today we discuss JSON related topic like introduction, advantage, syntax etc.
The light-weight text-data interchange format is a JavaScript Object Notation or short form is JSON.




It is used to store the information in an organized manner.
It helps to transmit data between web application and server. It is designed for human-readable data interchange.

Overview of JSON

  • JSON stands for JavaScript Object Notation
  • JSON is not a programming language
  • The JSON has extended from JavaScript Scripting language.



  • The light weight text data interchange is JSON
  • the file name extrnsion is .json

Advantage of JSON

  • It is alternative of XML.
  • It is a lightweight data-interchange format.
  • It is is language independent, That means, you can you JSON with any language.



  • It is easy to use and understand.
  • JSON is easy to read and write

JSON Syntax

All syntax of JSON is same like JavaScript syntax. JSON syntax is derived from JavaScript object notation syntax

  • In JSON data is write in name/value pairs.
  • Square brackets are used for store arrays.
  • Every data in JSON is separated using commas.
  • Curly braces are used for store objects.

JSON data – Name and a Value

In JSON data is write in name/value pairs, every name is written in double quotes ” ” . And each data is separated using commas.


"employeefirstName":"Pritty"

JSON Objects

JSON objects are written inside the curly braces like { }. Same like JavaScript JSON objects can contain multiple name/values pairs.


{"employeefirstName":"Pritty", "employeelastName":"Times"}




JSON Arrays

JSON arrays are written inside square brackets [ ]. Same like JavaScript, a JSON array can contain multiple objects.


"employees":[
{"employeefirstName":"Pritty", "employeelastName":"Times"},
{"employeefirstName":"Princy", "employeelastName":"Varghese"},
{"employeefirstName":"Prince", "employeelastName":"Thomas"}
]

JSON Datatype

TYPE DESCRIPTION
Number double- precision floating-point format in JavaScript
String double-quoted Unicode with backslash escaping
Boolean true or false
Array an ordered sequence of values
Value it can be a string, a number, true or false, null etc
Object an un-ordered collection of key:value pairs
Whitespace It can be used between any pair of tokens
null empty




If anyone has doubts on this topic then please do let me know by leaving comments or send me an email.

Share webpage url content in Social media using php and Javascript

Hi all,
Welcome to my blog. Today we discuss one useful and different topic related to share webpage url content in social media using php and javascript.
In blogging, the social media is very important part. That will grow our site rank. Because we share our blog content through social media.
Then our site content reaches many people and they can use and refer our site content easily.
Here I share you one useful tips to share webpage url in top major social media websites by using php with javascript.

Page Content

  • PHP
  • JavaScript

In here, share the webpage url content in social media like facebook, twitter,google plus, linkedin, pinterest, digg and stumbleupon.

SYNTAX

  1. FACEBOOK

  2. http://www.facebook.com/share.php?u=[URL]&title=[TITLE]




  3. TWITTER




  4. http://twitter.com/home?status=[TITLE]+[URL]

  5. GOOGLE PLUS
  6. https://plus.google.com/share?url=[URL]



  7. PINTEREST
  8. http://pinterest.com/pin/create/button/?url=[EncodedURL]&media=[MEDIA]



  9. STUMBLEUPON
  10. http://www.stumbleupon.com/submit?url=[URL]&title=[TITLE]

  11. LINKEDIN
  12. http://www.linkedin.com/shareArticle?mini=true&url=[URL]&title=[TITLE]



  13. DIGG
  14. http://www.digg.com/submit?phase=2&url=[URL]&title=[TITLE]

    Full Code

    Share content URL in social media using PHP
    
    
    
    

    Share content URL in social media using PHP




    If anyone has doubts on this topic then please do let me know by leaving comments or send me an email.

How to Rename Uncategorized Category in WordPress

Hi all,
If you want to rename the uncategorized category in wordpress or you can rename the existing category name through wordpress dashboard. We can add category, edit category, delete existing category through wordpress dashboard.
In this article, we will show you how to rename the uncategorized category or rename the existing category name in WordPress.

You do a fresh install of WordPress, it’s already sets up some defaults. You get a default post, category and comment. In wordpress dashboard, the comments and post can delete but we can’t delete the default category named as uncategorized.
When there is no category chosen for a post, WordPress selects the Uncategorized category for that article before it is published.

What is Default Category in WordPress?




The uncategorized category is the default category in wordpress installation. This default category can’t delete from wordpress category list. Edit( rename category ), view functionalities are performed here.
Other categories like not a default category, can edit, delete and view functions are performed.

Renaming Uncategorized Category in WordPress

You can’t delete a default category, but you can rename or view it.
First, login into wordpress dashboard You need to visit Posts » Categories page in the WordPress admin and click on the edit link below the Uncategorized category.

wordpress_category




Posts>>Categories list existing category including default category.

On this page you should see the option to add a new category to the left and a list of the categories you have already set up on the right.

wordpress_category1



This will bring you to the category edit screen where you can rename your category.

wordpress_category2

Edit the default category name uncategorized to another name.





wordpress_category3

Happy Coding

If anyone has doubts on this topic then please do let me know by leaving comments or send me an email.

Animated contact form using jQuery

Hi all,
In this tutorial we will create simple animated contact us form. This is very simple and reuse as our wish. You can use this contact form in your site, this is light weight contact form. This is animated contact form, this looks good and loads faster.

Page Structure




  • HTML
  • jQuery
  • CSS

demo

HTML Code




The HTML part is very important in wed development. All informations are specified here. Displayed details are described here, whatever we include here, that’s displayed in web page.


	
	

jQuery Animated Contact Us Form

CSS

The CSS style sheet in contact us form is used for specifying the form style in HTML. It's very easy to understand and can implement more attractive in your web dpplication.

	

In here, style.css is an external file. This is included for form styling.

Style.css

body {
    background: #DCDCDC;
}
.container{
	max-width: 970px;
	margin: 50px auto;
}
.overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.85);
    z-index: 2;
}
.overlay, .form-wrapper {
	display: none;
}
.wrapper {
    background: #fff;
    max-width: 600px;
    margin: 0 auto;
    padding: 50px;
    z-index: 1;
}
.heading {
    margin: 0 auto;
    text-align: center;
}
.heading h2 {
    color: #000;
    border-bottom: 3px double #FF6A00;
    display: inline-block;
    margin: 0;
    padding-bottom: 5px;
    margin-bottom: 20px;
    padding-left: 8px;
    padding-right: 8px;
}
.btn {
    border-left: 4px solid #FF6A00;
    margin-bottom: 30px;
    padding: 25px 10px;
    background: #E8E8E8;
    position: relative;
    padding-left: 15px;
    padding-right: 130px;
}
.btn p{
	margin: 0;
}
.btn a {
    position: absolute;
    top: 15px;
    right: 15px;
    background: #FF6A00;
    padding: 10px 15px;
    color: #fff;
    font-weight: 600;
    border-radius: 3px;
    cursor: pointer;
}
.form-wrapper {
    border: 2px solid #DCDCDC;
    position: absolute;
    top: 50%;
    margin-top: -160px;
    left: 50%;
    margin-left: -157px;
    padding: 30px;
    background: #fff;
}
.form-wrapper h3 {
    font-size: 22px;
    margin-top: 0;
    margin-bottom: 10px;
}
input[type="text"], input[type="email"], textarea {
    display: block;
    width: 250px;
    height: 30px;
    padding-left: 5px;
    margin-bottom: 15px;
    border: 2px solid #ccc;
    border-radius: 3px;
}
textarea{
	height: 80px;
	max-width: 250px;
}
input[type="text"]:focus, input[type="email"]:focus, textarea:focus {
	border-color: #FF6A00;
	outline: 0;

}
input[type="button"] {
    background: #FF6A00;
    border: 2px solid #FF6A00;
    padding: 8px 20px;
    color: #fff;
    font-weight: 600;
    outline: 0;
    border-radius: 3px;
    cursor: pointer;
}
input[type="button"]:hover {
    background: #fff;
    color: #FF6A00;
}
.form-wrapper span#close {
    background: url('../images/plus.png');
    width: 12px;
    height: 12px;
    display: inline-block;
    position: absolute;
    top: 5;
    right: 5;
    cursor: pointer;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

jQuery

Include jQuery library file and jquery code related to contact us.

	
	

Happy Coding




If anyone has doubts on this topic then please do let me know by leaving comments or send me an email.