rbgtech

Why github is the new Resume for web developers

noreply@blogger.com (renson) — Sun, 03 Oct 2021 12:52:00 +0000

Why learn Git hub as a programmer?

As a matter of fact, many recruiters in the field of programming or web development expect you as a programmer to use the new technology to sell your skills, for example, the recruiters expect to see your portfolio and not the paperwork, besides that you are also expected as a programmer to showcase the sample of the work you have done, and this forms the basis for learning Github.

Basics of Git hub

Git: This is software for tracking changes during a set of files with the aim of coordinating work among programmers working together developing ASCII text file during the software development process.

Github: it is a website and cloud-based service provider that allows programmers to store, manage and share source code.

Repository: It is a central place or a folder where programmers can store and manage their codes.

Fork: It means writing a second copy of the original code but with the aim of producing the same result and after it working you can now merge it to the original codebase. This applies especially when programmers are working as a community and they want to contribute to your source code though they cannot change your code and if their contributions are helpful you can now decide to merge or implement their code.

Pull request: This is a way developers can notify others in the team about the changes you have pushed to a branch in the repository on GitHub. This allows your teammates to review your code and discuss giving different suggestions if needed before the final copy can be merged to the base branch.

Git push: this is a time when you want to send your commits and ask them to update their branch

Version control: this is often the practice of tracking and managing changes to the code or the software.

How to push code to GitHub

There are two ways, one of it is by using GitHub desktop or git command line

Using command line

If you do not have a GitHub desktop and want to use the command line to commit your project to your git hub account, then you have to type in the browser github.com.It will direct you to the dashboard where you will see the green button to create the new repository.

Then on the same project page, you will click the green “Code” to display the URL that you will use to connect to that folder, copy the URL.

Connecting the local repository and the remote repository you will use:

$ git remote add origin

Pushing the changes you have made from the local repository to the new remote repository you will use this command:

$ git push origin master

1. Using the terminal or the command line you have to make sure that you are in the correct file where your project is.

2. use git status to check if git is initialized.

In case you encounter a mistake message: fatal: Not a git repository (or any of the parent directories): .git, meaning that the folder where your project isn't being tracked. To correct the error, type git init and then continue with the process of committing your project.

Also if other errors might appear, you can copy the error and paste it in google chrome to search.

Some Useful commands to note

Pull request using command line

This allows others to make changes to your project without interfering with the original work.

Here are some useful commands to learn:

1. git pull “remote name” “branch name”

2. git pull consists of both git fetch and git merge combined together.

3. git fetch: it takes the recent commits in the local repository

4. git merge: it merges the branch from a remote to a local branch

5. git checkout –b “branch name”: It helps in making a new branch with its name.

Using Git Hub desktop to push code

The first thing to do is to download the executable file for GitHub desktop and it is available for any operating system.

You need to sign up or create an account with GitHub as a prerequisite.

Quick set up to GitHub desktop

Click the button as shown below and a pop up will appear telling you to open GitHub desktop

Clone a repository on desktop

Cloning means a copy of a target repository

Using GitHub desktop, click the clone button to create a copy of the repository or simply a folder.

When a new folder is created in your local computer, another hidden directory is also created with the “.git” extension.

Copy all of your work to the cloned folder and that can include even the images and any other files.

Commit to master on Github Desktop

All the files you added to the cloned folder can be seen on the GitHub desktop. You can give a comment on the files that you want to submit

Image

Publish branch to GitHub

You can publish your files to the GitHub space by clicking the “publish branch” button.

Lastly, you can check if it has been successfully published.

How to customize blogger theme

noreply@blogger.com (renson) — Mon, 13 Sep 2021 15:48:00 +0000

How to change the blog template website

The first step is to sign in to your blogger account

While at your blog on the left side menu click the theme and it will direct you to the tab where you will be asked to back up the current theme or directly click the restore tab where you will be able to upload the free theme which you should have downloaded.

How to get free themes for your website

Visit templatesyard.com and you will get very many blogs templates

Click one of the templates and download the free version

After the download is complete extract the file to get the XML document which will be uploaded to our blog.

How to customize your blogger layout

While still on your blogger, on the left menu click the layout tab and it will direct you to the different layout of the theme, make sure to click the writing icon in each part to change or even delete the link.

How to change the social plugins

1. Visit the social plugin right from the top to the bottom of the layout and click the pen icon to allow you to write.

2. In case you do not have some social sites for example YouTube you will then have to delete it but if you have it you can link your YouTube channel by copying the link from the browser and pasting it at the social plugin on the YouTube section. The same applies to other social plugins

3. After the whole changes are made make sure to save on the layout section and the whole theme, the button found on the right and bottom section of the theme. Then keep checking for every step on the changes you have made

How and Why I became a blogger

noreply@blogger.com (renson) — Sun, 12 Sep 2021 11:49:00 +0000

My Area of specialization

Here I am introducing a niche that I will pursue in the online space and that is web development and its surrounding technology.

This comes after my own experience in my career life, I was learning different programming languages but could not combine them to create something that I could see with other samples of websites but when it came to doing an exam I was good and scoring high but was not fully satisfied for I could not do much or else it takes a lot of time to make something small.

With the experience I had to search for content on practical tutorials and this led me to different ways with different frameworks and programming languages, at first they were hard to even prepare the space for starting the first project and this is very common with all as long as it is the first time to do it.

It also was not enough to learn the frameworks and the new technology because there were also very many new technology and frameworks in the many tutorials that I found and this made me to even be confused , and this challenge made me launch my blogging work to analyze for many having the same challenge as me and simplified the problem that many beginners in the web development career suffer from.

Learning web development though not enough again without knowing how to deploy the website to the online space, has made me introduce the same to my audience who most of them are students or beginners but also can be helpful to those who want to launch online business through a website.

There are many companies that offer hosting services and all seem to be offering the same services but strict analysis on the subject will help the audience to understand the variety of hosting companies available and how one is different from the other, the extensive analysis has helped and will continue helping the students to know the one that offers free hosting services for practicing purposes.

In conclusion,I would like to welcome all who are interested with web development and web technology as we explore the world of technology.

What is the best web hosting service in 2021?

noreply@blogger.com (renson) — Fri, 10 Sep 2021 12:01:00 +0000

What is web hosting?

Web hosting services is an internet hosting service that permits individuals and corporates to make their website to be available to the worldwide web. Web hosts are companies that can provide

data center space and also they can lease their server space to clients including other internet connectivity services.

Web hosting providers

For the better running of your website you need to make the best choice on the hosting company that will meet your needs, the examples of the top hosting providers include:

Top 10 web hosting providers

1. Blue host

2. Hostgator

3. Hostinger

4.GoDaddy

5. Dreamhost

6. Hostpapa

7. IONOS

8. Network solutions

9.A2 Hosting

Which web hosting is best for beginners?

Concerning the web best hosting that is friendly to the beginners include :

Top 3 web hosting for beginners

1. Bluehost

They offer a variety of solutions that include: shared hosting, VP hosting, WordPress hosting, dedicated hosting, and WooCommerse.

Features for Bluehost

It offers a free domain name for the first year

It has a WordPress builder

It has 24/7 expert support

It has a basic plan for the beginners at $2.95/mo*

2. Hostinger

This is another hosting provider that has a starting basic plan of $2.59/mo* plus a free .com domain for the first year including a free SSL.

It also has a 30-day money payback if you are not satisfied with its services. Without forgetting 24/7 support, Free Email, Manages WordPress.

3. Hostgator

This is another site that can be considered when choosing to launch your website in the space, It has some free features that include: Unmetered bandwidth to help you bring the traffic you want, free domain registration, free SSL certificate to ensure your visitors are secured and also allows one-click installs. Most importantly it has the basic plan of $2.75/mo*.

Free web hosting for students

The best site that allows students to host their website for free is Heroku though not limited to students only but generally for beginners, it has extensive features that include backend capabilities.

How to start with Heroku?

Offers to check on internet service providers

For you to land on the best hosting provider, it is best to check on some of the major tips on the hosting provider that carry your website, brand, and business in the online space.

Here are some of the guides that will help you in making a budget.

1. The free domain

It is very nice to land on a company that offers free domain services but again take note of these:

a)Do they transfer the ownership to you or do they hold the ownership? If they own the ownership rights then it means you can not transfer later to another hosting company, or maybe pay a huge amount of money to get it back.

b)What is the renewal fee after one year of a huge cutoff discount?

These are the questions that you need to understand before you decide on any.

2)Do they allow separate buying of the domain name and hosting?

Since the domain name is your identity in the online space then you must decide very well on the hosting company if it can allow you to buy the domain name from other companies or you are restricted to only using the one from them.

It is safer to go for the one that gives you the freedom to get the domain name from other sites that suit you.

3.)Take note of the bandwidth and disk space Terms and conditions

It is very important to note that the hosting company can not offer more disk space and bandwidth than what they have stated in their terms. In case your website grows very fast then you would think of the expense that you will make to sustain the demand.

4)buy and save with commission coupons

It is also essential to check whether the hosting has an affiliate program that might earn you commission and even some free coups that might help in reducing the total cost of purchase.

5)Backup your data

It is good practice always to have an offline backup of your data and not to fully trust the hosting company to do it for you.

6.)Time duration of the contract with the hosting company

Try as much as possible to avoid long-term contracts with the hosting company unless you trust their services then you can go ahead.

Impact Of Technology in Our Society

noreply@blogger.com (renson) — Sun, 05 Sep 2021 11:51:00 +0000

Impact Of Technology in Our Society

Ancient and modern human civilization have in one way or another benefited with advancement in technology,complex tasks have been able to be performed with a lot of ease with a short period of time but also we can never fail to mention of its negative impacts that it has also caused in the society.

Having realized the two phases that technology has brought to our society ,we therefore are going to dig deeper on the positive and negative impacts of technology

Positive Impact Technology in Our Society

As we know that technology has become part of human lifestyle in terms of communication,education,transport,health,agriculture and many more

Communication

Many people all over the world are able to interact ,pass and receive information effectively due to advancement in telecommunication sector.The emerging of social media such as facebook,pinterest,Watsapp with advanced features such as video conferencing has made the world to appear as a small and reachable community.

Education

The advancement of technology has boosted the education sector in Kenya and globally where knowledge is available on the internet on almost everything ,besides that most learning institutions are going online and offering their services there to meet the demand of large population in need on knowledge.It has also helped cut off the heavy expenses that could have been used as most of online education is free.

Transport

In the ancient times it was cumbersome to travel long distances and even to transport goods over long distances but with the advancement of technology on transportation sector such as introduction of air ,water and road transport has allowed the society to make a choice on what means of transport to use and hence has helped in shaping our modern world.

Health

The health of people being very essential and a priority in all the countries in the world,we can therefore say that there has been a drastic advancement in this area and the most scaring diseases such as HIV & AIDS and other dangerous diseases in the world have been handled with ease and for others with the advancement in technology research has been easily conducted unlike in the ancient times when there was nothing to help even protect the doctors who were treating the patients and even the means of testing the patients was hard.

Agriculture

Ancient agricultural practices have radically been revolutionized with the modern machines such as the use of tractors to plough ,plant and even harvest.The modern way of preserving water has given room even for the excess to be used in irrigating crops hence ensuring all year farming and not depending on seasonal changes.All this advancement has helped produce surplus produce to feed the high population.

Negative Impacts of Technology in our society

Even with the many positive impacts that the technology has brought in our society,there are also some negative impacts that it has left behind and it is still causing.They include:

Time Wasting

The advancement of technology has made many people to loose that social nature of being as most of their time is spent in watching ,listening,reading or even using the tools more than interacting and socializing with others ,to a point where families break up or quarrel one another also the children lacking the parental guidance and love as both of them do not have time for the other.

Psychological and Health Problems

Due to more time being spent in the gadgets such as smart phones and laptops and cheap internet among other things has led to more harm to the health of persons using them oftelyn such as eye problems caused by light of the same gadgets or even due to wrong body balance as you use the gadgets may lead to long term problems on the spinal cord and other parts of the body.Watching of horrifying movies and clips and even some containing pornographic acts which erode the good social values and tampers with the brain.

Conclusion:

The correct use of technology will ensure success in the society and for this to be achieved the effort of everybody from the family members at home to the religious institutions and to the government and the most affected generation is the younger one that needs direction and substitute sources of learning information need be used such as textbooks

Top 8 Web Development IDE's

noreply@blogger.com (renson) — Thu, 12 Aug 2021 12:06:00 +0000

Web Development IDE's

What is an IDE?

An integrated development environment(IDE): is a software application that provides comprehensive facilities to computer programmers for software development. An IDE normally consists of at least a source code editor, build automation tools and a debugger.

Why do we need an IDE?

The major reason for the need of an IDE is that they offer a central interface with all the tools a developer needs, including: a Debugger: Debuggers are used during testing and can help developers debug their application programs.

Best IDE for web development 2021

1.Visual studio code

.Visual Studio Code is a source-code editor made by Microsoft for Windows, Linux and macOS. Features include support for debugging, syntax highlighting, intelligent code completion, snippets, code refactoring, and embedded Git. Users can change the theme, keyboard shortcuts, preferences, and install extensions that add additional functionality.

.Visual studio code can be used with a variety of programming languages which include: Java, JavaScript, Go, Node.js, Python and C++.

2.Atom by Github

Atom is a free and open-source text and source code editor for macOS, Linux, and Microsoft Windows with support for plug-ins written in JavaScript, and embedded Git Control, developed by GitHub. Atom is a desktop application built using web technologies

Atom's default packages can apply syntax highlighting for multiple programming languages and file formats.Besides that it is easy to use even with the beginners.

3.Sublime Text 3

Sublime Text is a commercial source code editor. It natively supports many programming languages and markup languages. Users can expand its functionality with plugins, typically community-built and maintained under free-software licenses. To facilitate plugins, Sublime Text features a Python API.

Features of Sublime Text

.Auto-save, which attempts to prevent users from losing their work

.Customizable key assignments, a navigational tool which allows users to assign hotkeys to their choice of options in both the menus and the toolbar

.Find as you type, begins to look for the text being entered as the user types without requiring a separate dialog box

.Spell check function corrects as you type

.Repeat the last action

A wide selection of editing commands, including indenting and unindenting, paragraph reformatting and line joining

4.PYcharm

PYcharm ide is used in computer programming, specifically for the Python language. It provides code analysis, a graphical debugger, an integrated unit tester, integration with version control systems (VCSes), and supports web development with Django as well as data science with Anaconda.

Features of PYcharm

.Coding assistance and analysis, with code completion, syntax and error highlighting, linter integration, and quick fixes

.Project and code navigation: specialized project views, file structure views and quick jumping between files, classes, methods and usages

.Python refactoring: includes rename, extract method, introduce variable, introduce constant, pull up, push down and others

.Support for web frameworks: Django, web2py and Flask [professional edition only]

.Integrated Python debugger

.Integrated unit testing, with line-by-line code coverage

.Google App Engine Python development [professional edition only]

.Support for scientific tools like matplotlib, numpy and scipy [professional edition only]

.It competes mainly with a number of other Python-oriented IDEs, including Eclipse's PyDev, and the more broadly focused Komodo IDE.

PyCharm provides an API so that developers can write their own plugins to extend PyCharm features. Several plugins from other JetBrains IDE also work with PyCharm. There are more than 1000 plugins which are compatible with PyCharm.

5.Intellij

It is an integrated development environment (IDE) written in Java for developing computer software developed by JetBrains .

Features of Intellij

Coding assistance:The IDE provides certain features like code completion by analyzing the context, code navigation which allows jumping to a class or declaration in the code directly, code refactoring, code debugging.

It supports many programming languages which include:

.HTML/XHTML/CSS

.JavaScript

.PHP (via a plugin)

.Ruby/JRuby

.SQL

TypeScript and many more.

System Requirement:

Here are some of the key specifications to check on your computer before you install this IDE:

.RAM: 2 GB RAM minimum, 8 GB RAM recommended.

.Disk space:2.5 GB and another 1 GB for caches minimum, solid-state drive with at least 5 GB of free space recommended.

.OS Version: 64 Bit Microsoft Windows 8 or later macOS 10.13 or later Any Linux distribution that supports Gnome, KDE, or Unity DE.

6.PHPStorm

PhpStorm provides an editor for PHP, HTML and JavaScript with on-the-fly code analysis, error prevention and automated refactorings for PHP and JavaScript code.

Features of PHP Storm

PhpStorm provides a rich code editor[9] for PHP with syntax highlighting, extended code formatting configuration, on-the-fly error checking, and code completion.

Code autocompletion finalizes classes, methods, variable names, and PHP keywords, plus commonly used names for fields and variables depending on their type.

7.WebStorm

This IDE shares the same featurs with PHPStorm

8.NetBeans

NetBeans is an integrated development environment (IDE) for Java. NetBeans allows applications to be developed from a set of modular software components called modules. NetBeans runs on Windows, macOS, Linux and Solaris. In addition to Java development, it has extensions for other languages like PHP, C, C++, HTML5, and JavaScript.

Conclusion

There is a need for you to choose the best tool and learn to use it ,for this is what makes a part of the best web developer.By using the IDE tool ,it will save your coding time and easy to identify errors in your code.

Social Networking project part 2

noreply@blogger.com (renson) — Thu, 12 Aug 2021 06:49:00 +0000

Social Networking website part 2

This is the second part of the social networking project ,if you have not done the first part check it out first here

profile.php

One of the first things that new users may want to do after signing up and logging in is to create a profile.

Here is a program to upload,resize and sharpen the images:

. profile.php

<?php

 require_once 'header.php';

 if (!$loggedin) die();

 echo "<div class='main'><h3>Your Profile</h3>";

 $result = queryMysql("SELECT * FROM profiles WHERE user='$user'");

 if (isset($_POST['text']))

 {

 $text = sanitizeString($_POST['text']);

 $text = preg_replace('/\s\s+/', ' ', $text);

 if ($result->num_rows)

queryMysql("UPDATE profiles SET text='$text' where user='$user'");

 else queryMysql("INSERT INTO profiles VALUES('$user', '$text')");

 }

 else

 {

 if ($result->num_rows)

 {

 $row = $result->fetch_array(MYSQLI_ASSOC);

 $text = stripslashes($row['text']);

}

 else $text = "";

 }

 $text = stripslashes(preg_replace('/\s\s+/', ' ', $text));

 if (isset($_FILES['image']['name']))

 {

 $saveto = "$user.jpg";

 move_uploaded_file($_FILES['image']['tmp_name'], $saveto);

 $typeok = TRUE;

 switch($_FILES['image']['type'])

 {

 case "image/gif": $src = imagecreatefromgif($saveto); break;

 case "image/jpeg": // Both regular and progressive jpegs

 case "image/pjpeg": $src = imagecreatefromjpeg($saveto); break;

 case "image/png": $src = imagecreatefrompng($saveto); break;

 default: $typeok = FALSE; break;

 }

 if ($typeok)

{

 list($w, $h) = getimagesize($saveto);

 $max = 100;

 $tw = $w;

 $th = $h;

 if ($w > $h && $max < $w)

 {

 $th = $max / $w * $h;

 $tw = $max;

 }

 elseif ($h > $w && $max < $h)

 {

 $tw = $max / $h * $w;

 $th = $max;

 }

 elseif ($max < $w)

 {

 $tw = $th = $max;

 }

 $tmp = imagecreatetruecolor($tw, $th);

 imagecopyresampled($tmp, $src, 0, 0, 0, 0, $tw, $th, $w, $h);

 imageconvolution($tmp, array(array(-1, -1, -1),

 array(-1, 16, -1), array(-1, -1, -1)), 8, 0);

 imagejpeg($tmp, $saveto);

imagedestroy($tmp);

 imagedestroy($src);

 }

}

 showProfile($user);

 echo <<<_END

 <form method='post' action='profile.php' enctype='multipart/form-data'>

 <h3>Enter or edit your details and/or upload an image</h3>

 <textarea name='text' cols='50' rows='3'>$text</textarea><br>

_END;

?>

 Image: <input type='file' name='image' size='14'>

 <input type='submit' value='Save Profile'>

 </form></div><br>

</body>

</html>

Explanation of the code:

Beginning the the HTML form at the end of the code,the form has the parameter

enctype='multipart/form-data'.

This helps us send more than one type of data at a time eg: an image and text.There’s also an input type of file, which creates a Browse button that a user can press to select a file to be uploaded.

When the form is submitted, the code at the start of the program is executed.

The first thing it does is ensure that a user is logged in before the program execution to proceed.

Adding the “About Me” Text

The Post variable text is checked if there is text that has been added.If so,then it undergoes sanitization for security purposes but If no text was posted, the database is queried to see whether any text already exists in order to prepopulate the textarea for the user to edit it.

Adding a Profile Image

Here the $_FILES system variable is checked to see whether an image has been uploaded. If so, a string variable called $saveto is created,based on the user’s username followed by the extension .jpg. For example, user Jill will cause $saveto to have the value Jill.jpg.

Then the uploaded image type is examined and is accepted only if it is a jpeg, png, or gif image.

Upon success, the variable $src is populated with the uploaded image using one of the imagecreatefrom functions according to the image type uploaded.

The image is now in a raw format that PHP can process. If the image is not of an allowed type, the flag $typeok is set to FALSE, preventing the final section of image upload code from being processed.

Processing the Image

First we store the image dimensions using this statement

list($w, $h) = getimagesize($saveto);

If you want a smaller or larger thumbnail we use $max (which is set to 100), which gets the new dimensions which will result in a new image.

The function imagecreatetruecolor is called to create a new, blank canvas $tw wide and $th high in $tmp. imagecopyresampled is called to resample the image

from $src, to the new $tmp

Finally, the image is saved as a jpeg file in the location defined by the variable $saveto, after which we remove both the original and the resized image canvases from memory using the imagedestroy function, returning the memory that was used.

members.php

Using members.php,your users will find other memebers and choose to add them as friends or drop them.Here is code snippet that does that work.

members.php

<?php

 require_once 'header.php';

 if (!$loggedin) die();

 echo "<div class='main'>";

 if (isset($_GET['view']))

 {

 $view = sanitizeString($_GET['view']);

 if ($view == $user) $name = "Your";

 else $name = "$view's";

echo "<h3>$name Profile</h3>";

 showProfile($view);

 echo "<a class='button' href='messages.php?view=$view'>" .

 "View $name messages</a><br><br>";

 die("</div></body></html>");

 }

 if (isset($_GET['add']))

 {

 $add = sanitizeString($_GET['add']);

 $result = queryMysql("SELECT * FROM friends WHERE user='$add'

 AND friend='$user'");

if (!$result->num_rows)

 queryMysql("INSERT INTO friends VALUES ('$add', '$user')");

 }

 elseif (isset($_GET['remove']))

 {

 $remove = sanitizeString($_GET['remove']);

 queryMysql("DELETE FROM friends WHERE user='$remove' AND friend='$user'");

 }

 $result = queryMysql("SELECT user FROM members ORDER BY user");

 $num = $result->num_rows;

 echo "<h3>Other Members</h3><ul>";

 for ($j = 0 ; $j < $num ; ++$j)

{

$row = $result->fetch_array(MYSQLI_ASSOC);

 if ($row['user'] == $user) continue;

 echo "<li><a href='members.php?view=" .

 $row['user'] . "'>" . $row['user'] . "</a>";

 $follow = "follow";

 $result1 = queryMysql("SELECT * FROM friends WHERE

 user='" . $row['user'] . "' AND friend='$user'");

 $t1 = $result1->num_rows;

 $result1 = queryMysql("SELECT * FROM friends WHERE

 user='$user' AND friend='" . $row['user'] . "'");

 $t2 = $result1->num_rows;

 if (($t1 + $t2) > 1) echo " &harr; is a mutual friend";

 elseif ($t1) echo " &larr; you are following";

 elseif ($t2) { echo " &rarr; is following you";

 $follow = "recip"; }

 if (!$t1) echo " [<a href='members.php?add=" .

 $row['user'] . "'>$follow</a>]";

 else echo " [<a href='members.php?remove=" .

 $row['user'] . "'>drop</a>]";

 }

?>

 </ul></div>

 </body>

</html>

Explanation of the code:

Adding and Dropping Friends

We can be able to add or drop friends by looking up the user in the MySQL friends table and either inserting a friend username or removing it from the table.

Listing All The Members

The final section of code issues a SQL query to list all usernames. The code places the number returned in the variable $num before outputting the page heading.

friends.php

This module shows a user's friends and followers.This is made possible by displaying afriend's table of a single user.

All the followers are saved into an array called $followers, and all the people being followed are placed in an array called $following. Then a neat piece of code is used to extract all those who are both following and followed by the user, like this:

$mutual = array_intersect($followers, $following);

Here is the code snippet that does that work:

friends.php

friends.php

<?php

 require_once 'header.php';

 if (!$loggedin) die();

 if (isset($_GET['view'])) $view = sanitizeString($_GET['view']);

 else $view = $user;

 if ($view == $user)

 {

 $name1 = $name2 = "Your";

 $name3 = "You are";

 }

 else

 {

 $name1 = "<a href='members.php?view=$view'>$view</a>'s";

 $name2 = "$view's";

 $name3 = "$view is";

 }

 echo "<div class='main'>";

 // Uncomment this line if you wish the user's profile to show here

 // showProfile($view);

$followers = array();

 $following = array();

 $result = queryMysql("SELECT * FROM friends WHERE user='$view'");

 $num = $result->num_rows;

 for ($j = 0 ; $j < $num ; ++$j)

 {

 $row = $result->fetch_array(MYSQLI_ASSOC);

 $followers[$j] = $row['friend'];

 }

 $result = queryMysql("SELECT * FROM friends WHERE friend='$view'");

 $num = $result->num_rows;

 for ($j = 0 ; $j < $num ; ++$j)

 {

 $row = $result->fetch_array(MYSQLI_ASSOC);

 $following[$j] = $row['user'];

 }

 $mutual = array_intersect($followers, $following);

 $followers = array_diff($followers, $mutual);

 $following = array_diff($following, $mutual);

 $friends = FALSE;

 if (sizeof($mutual))

 {

 echo "<span class='subhead'>$name2 mutual friends</span><ul>";

 foreach($mutual as $friend)

 echo "<li><a href='members.php?view=$friend'>$friend</a>";

 echo "</ul>";

$friends = TRUE;

 }

 if (sizeof($followers))

 {

 echo "<span class='subhead'>$name2 followers</span><ul>";

 foreach($followers as $friend)

 echo "<li><a href='members.php?view=$friend'>$friend</a>";

 echo "</ul>";

 $friends = TRUE;

 }

 if (sizeof($following))

 {

 echo "<span class='subhead'>$name3 following</span><ul>";

 foreach($following as $friend)

 echo "<li><a href='members.php?view=$friend'>$friend</a>";

 echo "</ul>";

 $friends = TRUE;

 }

if (!$friends) echo "<br>You don't have any friends yet.<br><br>";

 echo "<a class='button' href='messages.php?view=$view'>" .

 "View $name2 messages</a>";

?>

 </div><br>

 </body>

</html>

Social Networking Project part 1

noreply@blogger.com (renson) — Mon, 09 Aug 2021 09:12:00 +0000

Bringing all that we have learnt together

Designing a Social Networking Site

Things that are needed include:

• A sign-up process

• A login form

• A logout facility

• Session control

• User profiles with uploaded thumbnails

• A member directory

• Adding members as friends

• Public and private messaging between members

• How to style the project

functions.php

The functions uses five main functions:

createTable:Checks whether a table already exists and, if not, creates it

queryMysql:Issues a query to MySQL, outputting an error message if it fails

destroySession:Destroys a PHP session and clears its data to log users out

sanitizeString:Removes potentially malicious code or tags from user input

showProfile:Displays a user’s image and “about me” message if he has one

1.functions.php

<?php

 $dbhost = 'localhost'; // Unlikely to require changing

 $dbname = 'rbgtech'; // Modify these...

 $dbuser = 'root'; // ...variables according

 $dbpass = ' '; // ...to your installation

 $appname = "RBG Tech App"; // ...and preference

 $connection = new mysqli($dbhost, $dbuser, $dbpass, $dbname);

 if ($connection->connect_error) die($connection->connect_error);

function createTable($name, $query)

 {

 queryMysql("CREATE TABLE IF NOT EXISTS $name($query)");

 echo "Table '$name' created or already exists.<br>";

 }

 function queryMysql($query)

{

 global $connection;

$result = $connection->query($query);

 if (!$result) die($connection->error);

 return $result;

 }

 function destroySession( )

 {

 $_SESSION=array();

 if (session_id() != "" || isset($_COOKIE[session_name()]))

 setcookie(session_name(), '', time()-2592000, '/');

 session_destroy();

 }

 function sanitizeString($var)

 {

 global $connection;

$var = strip_tags($var);

 $var = htmlentities($var);

 $var = stripslashes($var);

 return $connection->real_escape_string($var);

 }

function showProfile($user)

 {

 if (file_exists("$user.jpg"))

 echo "<img src='$user.jpg' style='float:left;'>";

 $result = queryMysql("SELECT * FROM profiles WHERE user='$user'");

 if ($result->num_rows)

 {

 $row = $result->fetch_array(MYSQLI_ASSOC);

 echo stripslashes($row['text']) . "<br style='clear:left;'><br>";

 }

 }

?>

header.php

For uniformity, each page of the project needs to have access to the same set of fea‐

tures. Therefore,I placed these things in header.php

2.header.php

<?php

 session_start();

 echo "<!DOCTYPE html>\n<html><head>";

 require_once 'functions.php';

 $userstr = ' (Guest)';

 if (isset($_SESSION['user']))

 {

 $user = $_SESSION['user'];

 $loggedin = TRUE;

 $userstr = " ($user)";

 }

 else $loggedin = FALSE;

 echo "<title>$appname$userstr</title><link rel='stylesheet' " .

 "href='styles.css' type='text/css'>" .

 "</head><body><center><canvas id='logo' width='624' " .

 "height='96'>$appname</canvas></center>" .

 "<div class='appname'>$appname$userstr</div>" .

 "<script src='javascript.js'></script>";

 if ($loggedin)

 echo "<br ><ul class='menu'>" .

 "<li><a href='members.php?view=$user'>Home</a></li>" .

 "<li><a href='members.php'>Members</a></li>" .

 "<li><a href='friends.php'>Friends</a></li>" .

 "<li><a href='messages.php'>Messages</a></li>" .

 "<li><a href='profile.php'>Edit Profile</a></li>" .

 "<li><a href='logout.php'>Log out</a></li></ul><br>";

 else

 echo ("<br><ul class='menu'>" .

"<li><a href='index.php'>Home</a></li>" .

 "<li><a href='signup.php'>Sign up</a></li>" .

 "<li><a href='login.php'>Log in</a></li></ul><br>" .

 "<span class='info'>&#8658; You must be logged in to " .

 "view this page.</span><br><br>");

?>

setup.php

With the pair of included files written, it’s now time to set up the MySQL tables they

will use.

The tables created here have the following columns and names:

• members: username user (indexed), password pass

• messages: ID id (indexed), author auth (indexed), recipient recip, message type pm, message message

• friends: username user (indexed), friend’s username friend

• profiles: username user (indexed), “about me” text

Because the functio..

3. setup.php

<!DOCTYPE html>

<html>

 <head>

 <title>Setting up database</title>

 </head>

 <body>

 <h3>Setting up...</h3>

<?php

 require_once 'functions.php';

 createTable('members',

 'user VARCHAR(16),

 pass VARCHAR(16),

 INDEX(user(6))');

 createTable('messages',

 'id INT UNSIGNED AUTO_INCREMENT PRIMARY KEY,

 auth VARCHAR(16),

 recip VARCHAR(16),

 pm CHAR(1),

 time INT UNSIGNED,

 message VARCHAR(4096),

 INDEX(auth(6)),

 INDEX(recip(6))');

 createTable('friends',

 'user VARCHAR(16),

 friend VARCHAR(16),

 INDEX(user(6)),

 INDEX(friend(6))');

 createTable('profiles',

 'user VARCHAR(16),

 text VARCHAR(4096),

 INDEX(user(6))');

?>

 <br>...done.

 </body>

</html>

index.php

This file gives the project a home page.All

it does is display a simple welcome message. In a finished application, this would be

where you sell the virtues of your site to encourage sign-ups.

Incidentally, seeing as all the MySQL tables have been created and the include files saved,you can now load

4.index.php

<?php

 require_once 'header.php';

 echo "<br><span class='main'>Welcome to $appname,";

 if ($loggedin) echo " $user, you are logged in.";

 else echo ' please sign up and/or log in to join in.';

?>

 </span><br><br>

</body>

</html>

signup.php

Now we need a module that will allow users to join the social site.

5.signup.php

<?php

 require_once 'header.php';

 echo <<<_END

 <script>

 function checkUser(user)

 {

 if (user.value == '')

 {

 O('info').innerHTML = ''

 return

 }

 params = "user=" + user.value

 request = new ajaxRequest()

 request.open("POST", "checkuser.php", true)

 request.setRequestHeader("Content-type",

 "application/x-www-form-urlencoded")

 request.setRequestHeader("Content-length", params.length)

 request.setRequestHeader("Connection", "close")

 request.onreadystatechange = function()

 {

if (this.readyState == 4)

 if (this.status == 200)

 if (this.responseText != null)

 O('info').innerHTML = this.responseText

 }

 request.send(params)

 }

 function ajaxRequest()

 {

 try { var request = new XMLHttpRequest() }

 catch(e1) {

 try { request = new ActiveXObject("Msxml2.XMLHTTP") }

 catch(e2) {

 try { request = new ActiveXObject("Microsoft.XMLHTTP") }

 catch(e3) {

 request = false

 } } }

 return request

}

 </script>

 <div class='main'><h3>Please enter your details to sign up</h3>

_END;

$error = $user = $pass = "";

 if (isset($_SESSION['user'])) destroySession();

 if (isset($_POST['user']))

 {

 $user = sanitizeString($_POST['user']);

 $pass = sanitizeString($_POST['pass']);

 if ($user == "" || $pass == "")

 $error = "Not all fields were entered<br><br>";

 else

 {

 $result = queryMysql("SELECT * FROM members WHERE user='$user'");

 if ($result->num_rows)

 $error = "That username already exists<br><br>";

 else

 {

 queryMysql("INSERT INTO members VALUES('$user', '$pass')");

 die("<h4>Account created</h4>Please Log in.<br><br>");

 }

 }

 }

 echo <<<_END



<form method='post' action='signup.php'>$error

 <span class='fieldname'>Username</span>

 <input type='text' maxlength='16' name='user' value='$user'

onBlur='checkUser(this)'><span id='info'></span><br>

 <span class='fieldname'>Password</span>

 <input type='text' maxlength='16' name='pass'

 value='$pass'><br>

_END;

?>

<span class='fieldname'>&nbsp;</span>

 <input type='submit' value='Sign up'>

 </form></div><br>

 </body>

</html>

checkuser.php

To go with signup.php,checkuser.php looks for the username in the database and returns a string indicating whether it has already been registered.Because it relies on the functions sanitizeString and queryMysql, the program first includes the file functions.php.

Then, if the $_POST variable user has a value, the function looks it up in the database and, depending on whether it exists as a username, outputs either “Sorry, this username is taken” or “This username is available.” Just checking the function mysql_num_rows against the result is sufficient for this, as it will return 0 for not

found, or 1 if it is found.

The HTML entities ✘ and ✔ are also used to preface the string with either a cross or a checkmark.

6.checkuser.php

<?php

 require_once 'functions.php';

 if (isset($_POST['user']))

 {

 $user = sanitizeString($_POST['user']);

 $result = queryMysql("SELECT * FROM members WHERE user='$user'");

 if ($result->num_rows)

 echo "<span class='taken'>&nbsp;&#x2718; " .

 "This username is taken</span>";

 else

 echo "<span class='available'>&nbsp;&#x2714; " .

 "This username is available</span>";

 }

?>

login.php

Having signed up to the site,we therefore will need a login.php to allow people to access the site.

The main thing to note here is that, upon successful verification of the username and password, the session variables user and pass are given the username and password values. As long as the current session remains active, these variables will be accessible by all the programs in the project, allowing them to automatically provide access to logged-in users

7.login.php

<?php

 require_once 'header.php';

 echo "<div class='main'><h3>Please enter your details to log in</h3>";

 $error = $user = $pass = "";

 if (isset($_POST['user']))

 {

 $user = sanitizeString($_POST['user']);

 $pass = sanitizeString($_POST['pass']);

 if ($user == "" || $pass == "")

 $error = "Not all fields were entered<br>";

 else

 {

 $result = queryMySQL("SELECT user,pass FROM members

 WHERE user='$user' AND pass='$pass'");

 if ($result->num_rows == 0)

 {

 $error = "<span class='error'>Username/Password

 invalid</span><br><br>";

 }

 else

 {

 $_SESSION['user'] = $user;

 $_SESSION['pass'] = $pass;

 die("You are now logged in. Please <a href='members.php?view=$user'>" .

 "click here</a> to continue.<br><br>");

 }

}

 }

 echo <<<_END

 <form method='post' action='login.php'>$error

 <span class='fieldname'>Username</span><input type='text'

 maxlength='16' name='user' value='$user'><br>

 <span class='fieldname'>Password</span><input type='password'

 maxlength='16' name='pass' value='$pass'>

_END;

?>

 <br>

 <span class='fieldname'>&nbsp;</span>

 <input type='submit' value='Login'>

 </form><br></div>

 </body>

</html>

Essential tools that a web developer should know

noreply@blogger.com (renson) — Thu, 05 Aug 2021 12:56:00 +0000

Best tools that a Web developer should know

Here is a detailed list of tools that a web developer should know as you continue learning and advancing in skills:

1.Hosting and deployment of your site

It is very true that most developers build a website and they need it running but the challange comes when deploying it ,here comes an easier and free way,by using Netlify you can deploy your website though it is limited to a website without its backend

How to deploy your website for free using Netlify:

1.Have your static website,in other words the one that does not have any linkage with a database.

2.Push your code to GitHub ,BitBucket or GitLab,and if you don't have the account you can create with one of the site.

3.Create a netlify Account by signing up with the Netlify

4.In your "Overview" page select New site from Git.

5.Select the repo you want to deploy

6.Wait for your app to deploy as Netlify starts building and deploying your website

How to deploy your website on heroku for free:

Heroku is one ofthe most popular cloud service provider and it helps in hosting websites for free

.Prerequisite for using heroku is having github and heroku account.

Note carefully that Heroku only hosts and supports applications and not static web pages as on netlify,this means that you need to have a backend and this can be done with PHP or any other language that supports backend .

Get heroku here

2.Royalty free images and videos for your Web

This is a very important tool for use especially when you want to beautify your website with informative images,videos and music that is copyright free.Examples of the site to get this content is:pexels.com,coverr.com,unsplash.com

3.Mockup tools

This is also another tool to learn and be aware of if you want to be a website designer.A website mockup tool is a high fidelity simulation of how a website will look like,it is like an image of how your website will look like.The sites to visit include: figma.com,zeplin.com

Why is it important to use a web design mockup?

They are useful for visualization in such a way that :

a)You can decide on the color schemes and check on the color contrast

b)Choose the font type and sizes

c)Implement images,videos and other visuals

d)Ensure that every page is consistent with the overall design

.They also help in getting client feedback before building the project

.Learning mockup is for anyone who is interested in web development.Sites to get this tool is figma.com and zeplin.com

4.Project design ideas

Beacuse most of us are developers and not designers then this tool is most important to us as it exposes you to the best web designers and developers who have shared their ideas and from them we can make our own more better.The best sites to use are :awwwards.com and dribble.com

5.Icons and fonts

As we know that website design is very important for any company to attract customers.Having appropriate and consistent icons and fonts is part of what makes the design so effective and successful.The sites to easily access this tools include but not limited to flaticon.com,fontawesome.com,animated icons and googlefonts .

6.Exercises and algorithms

If you want to practice to improve in your skills,then try this sites :leetcode.com,codewars.com->this helps developers achieve code mastery through challenge

exercism.io->choose a language to master,complete coding challange,upload your solution and review it with a mentor

7.General tools->css tricks.com,caniuse.com,image compressor,emailjs.com

Here are some other important tools to note:

css-tricks.com->this site helps in getting css code snippets ready to help design your web easily .

In conclusion,these are just but among the top on the list that you should know though the list is endless.You can share of the ones that need to be included on the comment section below.

Ajax programming

noreply@blogger.com (renson) — Tue, 03 Aug 2021 16:25:00 +0000

Using Ajax

Ajax stands for Asynchronous JavaScript and XML,which, in simple terms, means using a set of methods built in to JavaScript to transfer data between the browser and a server in the background.

An excellent example of this technology is Google Maps in which new sections

of a map are downloaded from the server when needed, without requiring a page refresh.

Using Ajax not only substantially reduces the amount of data that must be sent back

and forth, but also makes web pages seamlessly dynamic—allowing them to behave

more like self-contained applications. The results are a much improved user interface

and better responsiveness.

Implementing Ajax using Javascript

Using XMLHttpRequest

There are three ways of creating an XMLHttpRequest object:

• IE 5: request = new ActiveXObject("Microsoft.XMLHTTP")

• IE 6+: request = new ActiveXObject("Msxml2.XMLHTTP")

• All others: request = new XMLHttpRequest()

This is the case because Microsoft chose to implement a change with the release of

Internet Explorer 6, while all other browsers use a slightly different method.Therefore, the code below will work for all major browsers released over the last few years.

A cross-browser Ajax function

function ajaxRequest()

{

try // Non IE Browser?

{ // Yes

var request = new XMLHttpRequest()

}

catch(e1)

{

try // IE 6+?

{ // Yes

request = new ActiveXObject("Msxml2.XMLHTTP")

}

catch(e2)

{

try // IE 5?

{ // Yes

request = new ActiveXObject("Microsoft.XMLHTTP")

}

catch(e3) // There is no AJAX Support

{

request = false

}

return request

}

</script>

Explanation of the code:

Here we are using try...catch construct.The try keyword executes the non internet Explorer Ajax command,and upon success, jumps on to the final return statement, where the new object is returned.

Otherwise, a catch traps the error, and the subsequent command is executed. Again,

upon success, the new object is returned; otherwise, the final of the three commands is tried.. If that attempt fails, then the browser doesn’t support Ajax and the request

object is set to false; otherwise, the object is returned. So there you have it: a cross browser Ajax request function that you may wish to add to your library of useful JavaScript functions.

XMLHttpRequest object’s properties

onreadystatechange : Specifies an event-handling function to be called whenever the readyState property of an object changes.

readyState : An integer property that reports on the status of a request. It can have any of these values: 0 =Uninitialized, 1 = Loading, 2 = Loaded, 3 = Interactive, and 4 = Completed.

responseText: The data returned by the server in text format.

responseXML: The data returned by the server in XML format.

status: The HTTP status code returned by the server.

statusText : The HTTP status text returned by the server.

An XMLHttpRequest object’s methods

abort() : Aborts the current request.

getAllResponseHeaders() : Returns all headers as a string.

getResponseHeader(param) : Returns the value of param as a string.

open('method', 'url', 'asynch'): Specifies the HTTP method to use (Get or Post), the target URL, and whether the request should be handled asynchronously (true or false).

send(data) :Sends data to the target server using the specified HTTP method.

setRequestHeader('param', 'value') : Sets a header with a parameter/value pair.

The need for properties and methods:

These properties and methods give you control over what data you send to the server

and receive back, as well as a choice of send and receive methods. For example, you

can choose whether to request data in plain text (which could include HTML and

other tags) or in XML format. You can also decide whether you wish to use the Post

or Get method to send to the server.

Let’s look at the Post method first by creating a very simple pair of documents: a com‐

bination of HTML and JavaScript, and a PHP program to interact via Ajax with the

first.

Your First Ajax Program

Type or copy the code and save it as given:

urlpost.html

<!DOCTYPE html>

<html>

 <head>

 <title>AJAX Example</title>

 </head>

 <body style='text-align:center'>

 <h1>Loading a web page into a DIV</h1>

 <div id='info'>This sentence will be replaced</div>

 <script>

 params = "url=amazon.com/gp/aw"

 request = new ajaxRequest()

 request.open("POST", "urlpost.php", true)

request.setRequestHeader("Content-type",

 "application/x-www-form-urlencoded")

 request.setRequestHeader("Content-length", params.length)

 request.setRequestHeader("Connection", "close")

 request.onreadystatechange = function()

 {

 if (this.readyState == 4)

 {

 if (this.status == 200)

 {

 if (this.responseText != null)

 {

 document.getElementById('info').innerHTML =

 this.responseText

 }

 else alert("Ajax error: No data received")

 }

 else alert( "Ajax error: " + this.statusText)

}

 }

 request.send(params)

 function ajaxRequest()

 {

 try

 {

 var request = new XMLHttpRequest()

 }

 catch(e1)

 {

 try

 {

 request = new ActiveXObject("Msxml2.XMLHTTP")

 }

catch(e2)

 {

 try

 {

 request = new ActiveXObject("Microsoft.XMLHTTP")

 }

 catch(e3)

 {

 request = false

 }

 }

 }

 return request

}

 </script>

 </body>

</html>

Note:Do not run it until you add its second part

urlpost.php

<?php // urlpost.php

 if (isset($_POST['url']))

 {

 echo file_get_contents('http://' . SanitizeString($_POST['url']));

 }

 function SanitizeString($var)

 {

 $var = strip_tags($var);

 $var = htmlentities($var);

 return stripslashes($var);

}

?>

Explanation of the code:

SanitizeString function helps in securing all posted data against hackers.

This program uses the file_get_contents PHP function to load in the web page at

the URL supplied to it in the Post variable $_POST['url']. The file_get_contents

function is versatile in that it loads in the entire contents of a file or web page from

either a local or a remote server; it even takes into account moved pages and other

redirects.

Using Get Instead of Post

As with submitting any form data,you can submit your data with Get though it is insecure.

Using Frameworks for Ajax

Now that you know how to code your own Ajax routines, you might like to investi‐

gate some of the free frameworks that are available to make it even easier, and which

offer many more advanced features,example :jQuery.

.Now we have reached a point where we will implement everything we have learnt by developing a social networking website make sure to check the next publish.

Form Validation In PHP

noreply@blogger.com (renson) — Mon, 02 Aug 2021 06:48:00 +0000

Redisplaying Forms with values already filled

Let's create adduser.php to receive the posted form perform its own val‐

idation, and then present the form again to the visitor if the validation fails.

Copy the code snippet below:

<?php // adduser.php

 // The PHP code

 $forename = $surname = $username = $password = $age = $email = "";

 if (isset($_POST['forename']))

 $forename = fix_string($_POST['forename']);

 if (isset($_POST['surname']))

 $surname = fix_string($_POST['surname']);

 if (isset($_POST['username']))

 $username = fix_string($_POST['username']);

 if (isset($_POST['password']))

 $password = fix_string($_POST['password']);

 if (isset($_POST['age']))

 $age = fix_string($_POST['age']);

if (isset($_POST['email']))

 $email = fix_string($_POST['email']);

 $fail = validate_forename($forename);

$fail .= validate_surname($surname);

 $fail .= validate_username($username);

 $fail .= validate_password($password);

 $fail .= validate_age($age);

 $fail .= validate_email($email);

 echo "<!DOCTYPE html>\n<html><head><title>An Example Form</title>";

 if ($fail == "")

 {

 echo "</head><body>Form data successfully validated:

 $forename, $surname, $username, $password, $age, $email.</body></html>";

 // This is where you would enter the posted fields into a database,

 // preferably using hash encryption for the password.

 exit;

 }

 echo <<<_END

 <!-- The HTML/JavaScript section -->

 <style>

 .signup {

 border: 1px solid #999999;

 font: normal 14px helvetica; color:#444444;

 }

 </style>

 <script>

 function validate(form)

 {

 fail = validateForename(form.forename.value)

 fail += validateSurname(form.surname.value)

 fail += validateUsername(form.username.value)

 fail += validatePassword(form.password.value)

 fail += validateAge(form.age.value)

 fail += validateEmail(form.email.value)

 if (fail == "") return true

 else { alert(fail); return false }

 }

 function validateForename(field)

 {

 return (field == "") ? "No Forename was entered.\n" : ""

 }



function validateSurname(field)

 {

 return (field == "") ? "No Surname was entered.\n" : ""

 }

 function validateUsername(field)

 {

 if (field == "") return "No Username was entered.\n"

 else if (field.length < 5)

 return "Usernames must be at least 5 characters.\n"

 else if (/[^a-zA-Z0-9_-]/.test(field))

 return "Only a-z, A-Z, 0-9, - and _ allowed in Usernames.\n"

 return ""

 }

 function validatePassword(field)

 {

 if (field == "") return "No Password was entered.\n"

 else if (field.length < 6)

return "Passwords must be at least 6 characters.\n"

 else if (!/[a-z]/.test(field) || ! /[A-Z]/.test(field) ||

 !/[0-9]/.test(field))

 return "Passwords require one each of a-z, A-Z and 0-9.\n"

 return ""

 }

 function validateAge(field)

 {

 if (isNaN(field)) return "No Age was entered.\n"

 else if (field < 18 || field > 110)

 return "Age must be between 18 and 110.\n"

 return ""

 }

 function validateEmail(field)

 {

 if (field == "") return "No Email was entered.\n"

 else if (!((field.indexOf(".") > 0) &&

 ((field.indexOf(".") > 0) &&

 (field.indexOf("@") > 0)) ||

 /[^a-zA-Z0-9.@_-]/.test(field))

 return "The Email address is invalid.\n"

 return ""

 }

 </script>

 </head>

 <body>

 <table border="0" cellpadding="2" cellspacing="5" bgcolor="#eeeeee">

 <th colspan="2" align="center">Signup Form</th>

 <tr><td colspan="2">Sorry, the following errors were found<br>

in your form: <p><font color=red size=1><i>$fail</i></font></p></td></tr>

 <form method="post" action="adduser.php" onSubmit="return validate(this)">

 <tr><td>Forename</td>

 <td><input type="text" maxlength="32" name="forename" value="$forename">

 </td></tr><tr><td>Surname</td>

 <td><input type="text" maxlength="32" name="surname" value="$surname">

 </td></tr><tr><td>Username</td>

 <td><input type="text" maxlength="16" name="username" value="$username">

 </td></tr><tr><td>Password</td>

 <td><input type="text" maxlength="12" name="password" value="$password">

 </td></tr><tr><td>Age</td>

 <td><input type="text" maxlength="3" name="age" value="$age">

 </td></tr><tr><td>Email</td>

 <td><input type="text" maxlength="64" name="email" value="$email">

 </td></tr><tr><td colspan="2" align="center"><input type="submit"

 value="Signup"></td></tr>

 </form>

 </table>

 </body>

</html>



 // The PHP functions

 function validate_forename($field)

 {

 return ($field == "") ? "No Forename was entered<br>": "";

 }

 function validate_surname($field)

 {

 return($field == "") ? "No Surname was entered<br>" : "";

 }

 function validate_username($field)

 {

 if ($field == "") return "No Username was entered<br>";

 else if (strlen($field) < 5)

 return "Usernames must be at least 5 characters<br>";

 else if (preg_match("/[^a-zA-Z0-9_-]/", $field))

 return "Only letters, numbers, - and _ in usernames<br>";

 return "";

 }

 function validate_password($field)

 {

 if ($field == "") return "No Password was entered<br>";

 else if (strlen($field) < 6)

 return "Passwords must be at least 6 characters<br>";

else if (!preg_match("/[a-z]/", $field) ||

 !preg_match("/[A-Z]/", $field) ||

 !preg_match("/[0-9]/", $field))

 return "Passwords require 1 each of a-z, A-Z and 0-9<br>";

 return "";

 }

 function validate_age($field)

 {

 if ($field == "") return "No Age was entered<br>";

 else if ($field < 18 || $field > 110)

 return "Age must be between 18 and 110<br>";

 return "";

 }

 function validate_email($field)

 {

 if ($field == "") return "No Email was entered<br>";

 else if (!((strpos($field, ".") > 0) &&

 (strpos($field, "@") > 0)) ||

 preg_match("/[^a-zA-Z0-9.@_-]/", $field))

 return "The Email address is invalid<br>";

 return "";

 }

 function fix_string($string)

 {

 if (get_magic_quotes_gpc()) $string = stripslashes($string);

 return htmlentities ($string);

 }

?>

In this example ,all input are sanitized before use, even passwords, because they may contain characters used to format HTML eg:< will become <

Explanation of the code:

The fix_string function (right at the end) is used to sanitize each field and prevent any attempts at code injection from

succeeding.

Also, you will see that the HTML form has been used within php in a <<<_END..._END; structure,displaying the form with the values that were entered previously.

You do this by simply adding an extra value parameter to each <input> tag (such as value="$forename").

This courtesy is highly recommended so that the user has to edit only the previously entered values, and doesn’t have to type the fields all over again.

Using Regular Expressions in PHP

The most common regular expression functions that you are likely to use in PHP are:

preg_match, preg_match_all, and preg_replace.

.preg_match:

Used to test wether a certain word appears anywhere within a string,in any combination of upper-case or lower-case

.preg_match_all:

If you wish to locate all matches, you use the preg_match_all function, like this:

$n = preg_match_all("/cats/i", "Cats are strange. I like cats.", $match);

echo "$n Matches: ";

for ($j=0 ; $j < $n ; ++$j) echo $match[0][$j]." ";

preg_replace:

.When you want to replace part of a string, you can use preg_replace as shown here.

This example replaces all occurrences of the word cats with the word dogs, regardless

of case:

echo preg_replace("/cats/i", "dogs", "Cats are furry. I like cats.");

.Now that you’ve seen how to bring all of PHP, HTML, and JavaScript together, the next publishing will introduce Ajax (Asynchronous JavaScript and XML), which uses

JavaScript calls to the server in the background to seamlessly update portions of a web page, without having to resubmit the entire page to the web server.

Feel free to comment and subscribe to get latest updates .

Top 7 backend frameworks to learn in 2021

noreply@blogger.com (renson) — Sun, 01 Aug 2021 10:39:00 +0000

BEST BACKEND FRAMEWORKS 2021

.Backend frameworks are libraries of server-side programming languages that help construct the backend structure of a site. It helps in building web applications easily.

.While backend frameworks are written in different languages,they all serve the same purpose.So the type of framework that you choose is dependent on the preference of the language you know and love.

Here are some of the popular frameworks for 2021

1.LARAVEL FRAMEWORK

.Laravel is a Model-View-Controller framework that comes with an intuitive interface, out-of-the-box API support, as well as tools, packages, and libraries that greatly simplify the development of modern and secure web applications.

.It is one of the youngest framework though popular,it uses PHP language in web development

2.DJANGO

.Django is a high-level, Model-View-Template (MVT) framework that supports the rapid development of backend web apps with less coding involved.Big companies such as Youtube,Instagram and Google use this frameworks.

3.Express.Js

Express.js is a fast, lightweight framework that provides a set of great features for web and mobile applications

4. Spring

Spring Framework

.Spring is a Model-View-Controller application framework and inversion of controll container for java platform,it also has an extension for buiding web applocations on top of java enterprise edition platform.Websites like wix,TicketMaster and Billguard use this framework

5.FLASK FRAMEWORK

Flask python framework

.It is a web micro framework that uses python.It is classiffied as microframework because it does not require particular tools or libraries but accepts extentions that can add application features .Applications such as Pinterest and LinkedIn uses this framework

6.RUBY ON RAILS/RAILS FRAMEWORK

.It is a server side web application framework that uses MVC pattern and is written in Ruby. It encourages and facilitates the use of web standards such as JSON or XML for data transfer and HTML, CSS and JavaScript for user interfacing. In addition to MVC, Rails emphasizes the use of other well-known software engineering patterns and paradigms, including convention over configuration (CoC), don't repeat yourself (DRY), and the active record pattern.

.Some well known sites that use Ruby on Rails include Airbnb, Crunchbase, Bloomberg,Dribbble,Github,shoppify,and Hulu.

7.Meteor Js FRAMEWORK

.MeteorJS, is a free and open-source isomorphic JavaScript web framework written using Node.js. It is a full-stack framework that uses JavaScript at the backend and frontend, allowing users to build real-time apps faster.

.In conclusion,we need these backend frameworks to help us do alot of work within a short time and as we know that time is money then most of us would prefer using them but you must have basics of the language you would like to specialize and then choose the framework that uses that language .

Javascript form validation

noreply@blogger.com (renson) — Thu, 29 Jul 2021 11:39:00 +0000

JavaScript and PHP Validation
and Error Handling

With some foundation in both PHP and JavaScript, it’s time to bring these technologies together to create web forms that are as user-friendly as possible.

We’ll be using PHP to create the forms and JavaScript to perform client-side validation to ensure that the data is as complete and correct as it can be before it is submitted.

Final validation of the input will then be made by PHP, which will, if necessary,present the form again to the user for further modification.

In the process, we will cover validation and regular expressions in both JavaScript and PHP.

Validating User input with javascript

The best types of validation to do in JavaScript are checking that fields have content if they are not to be left empty, ensuring that email addresses conform to the proper format, and ensuring that values entered are within expected bounds.

The validate.html Document

Let’s begin with a general sign-up form, common on most sites that offer memberships or registered users. The inputs requested will be forename, surname, username,password, age, and email address. Example below provides a good template for such a form please copy and compile it to check results.

A form with JavaScript validation

<!DOCTYPE html>

<html>

 <head>

 <title>rbgtech form</title>

 <style>

 .signup {

 border:1px solid #999999;

 font: normal 14px helvetica;

 color: #444444;

 }

 </style>

 <script>

 function validate(form)

 {

 fail = validateForename(form.forename.value)

 fail += validateSurname(form.surname.value)

 fail += validateUsername(form.username.value)

 fail += validatePassword(form.password.value)

 fail += validateAge(form.age.value)

 fail += validateEmail(form.email.value)

 if (fail == "") return true

 else { alert(fail); return false }

 }

function validateForename(field)

{

 return (field == "") ? "No Forename was entered.\n" : ""

}

function validateSurname(field)

{

 return (field == "") ? "No Surname was entered.\n" : ""

}

function validateUsername(field)

{

 if (field == "") return "No Username was entered.\n"

 else if (field.length < 5)

 return "Usernames must be at least 5 characters.\n"

 else if (/[^a-zA-Z0-9_-]/.test(field))

 return "Only a-z, A-Z, 0-9, - and _ allowed in Usernames.\n"

 return ""

}

function validatePassword(field)

{

 if (field == "") return "No Password was entered.\n"

 else if (field.length < 6)

 return "Passwords must be at least 6 characters.\n"

 else if (!/[a-z]/.test(field) || ! /[A-Z]/.test(field) ||

 !/[0-9]/.test(field))

 return "Passwords require one each of a-z, A-Z and 0-9.\n"

 return ""

}

function validateAge(field)

{

 if (isNaN(field)) return "No Age was entered.\n"

 else if (field < 18 || field > 110)

 return "Age must be between 18 and 110.\n"

 return ""

}

function validateEmail(field)

{

 if (field == "") return "No Email was entered.\n"

 else if (!((field.indexOf(".") > 0) &&

 (field.indexOf("@") > 0)) ||

 /[^a-zA-Z0-9.@_-]/.test(field))

 return "The Email address is invalid.\n"

 return ""

}

 </script>

 </head>

 <body>

 <table border="0" cellpadding="2" cellspacing="5" bgcolor="#eeeeee">

 <th colspan="2" align="center">Signup Form</th>

 <form method="post" action="adduser.php" onsubmit="return validate(this)">

 <tr><td>Forename</td>

 <td><input type="text" maxlength="32" name="forename"></td></tr>

 <tr><td>Surname</td>

 <td><input type="text" maxlength="32" name="surname"></td></tr>

 <tr><td>Username</td>

 <td><input type="text" maxlength="16" name="username"></td></tr>

 <tr><td>Password</td>

 <td><input type="text" maxlength="12" name="password"></td></tr>

 <tr><td>Age</td>

 <td><input type="text" maxlength="3" name="age"></td></tr>

 <tr><td>Email</td>

 <td><input type="text" maxlength="64" name="email"></td></tr>

<tr><td colspan="2" align="center"><input type="submit"

 value="Signup"></td></tr>

 </form>

 </table>

 </body>

</html>

Explanation of the code:

Between the <script> and </script> tags lies a single function called validate that itself calls up six other functions to validate each of the form’s input fields.

We’ll get to these functions shortly. For now I’ll just explain that they return either an empty string if a field validates, or an error message if it fails.

If there are any errors, the final line of the script pops up an alert box to display them.

Upon passing validation, the validate function returns a value of true; otherwise, it returns false. The return values from validate are important, because if it returns false, the form is prevented from being submitted.

This allows the user to close the alert pop up and make changes. If true is returned, no errors were encountered in the form’s fields and so the form is allowed to be submitted.

The second part of this example features the HTML for the form with each field and its name placed within its own row of a table.

This is pretty straightforward HTML,with the exception of the onSubmit="return validate(this)" statement within the opening <form> tag.

Using onSubmit, you can cause a function of your choice to be called when a form is submitted. That function can perform some checking and return a value of either true or false to signify whether the form should be allowed to be submitted.

The this parameter is the current object (i.e., this form) and is passed to the validate function just discussed. The validate function receives this parameter as the object form.

As you can see, the only JavaScript used within the form’s HTML is the call to return buried in the onSubmit attribute. Browsers with JavaScript disabled or not available will simply ignore the onSubbmit attribute, and the HTML will display just fine.

Validating the forename

validateForename is quite a short function that accepts the parameter field, which is the value of the forename passed to it by the validate function.

If this value is the empty string, an error message is returned; otherwise, an empty string is returned to signify that no error was encountered.

Validating the surname

The validateSurname function is almost identical to validateForename in that an error is returned only if the surname supplied was an empty string.

Validating the username

The validateUsername function has to allow through only the characters a-z, A-Z, 0-9, _ and -, and ensure that usernames are at least five characters long.

The if...else statements commence by returning an error if field has not been filled in. If it’s not the empty string, but is fewer than five characters in length,

another error message is returned.

Validating the password

Similar techniques are used in the validatePassword function. First the function checks whether field is empty, and if it is, returns an error.

Next, an error message is returned if a password is shorter than six characters.

One of the requirements we’re imposing on passwords is that they must have at least one each of a lowercase, uppercase, and numerical character, so the test function is called three times, once for each of these cases.

If any one of them returns false, one of the requirements was not met and so an error message is returned. Otherwise, the empty string is returned to signify that the password was OK.

Validating the age

validateAge returns an error message if field is not a number (determined by a call to the isNaN function), or if the age entered is lower than 18 or greater than 110.

Your applications may well have different or no age requirements. Again, upon successful validation,the empty string is returned.

Validating the email

In the last and most complicated example, the email address is validated with validateEmail. After checking whether anything was actually entered, and returning an error message if it wasn’t, the function calls the JavaScript indexOf function twice.

The first time a check is made to ensure there is a period (.) somewhere from at least the second character of the field, and the second checks that an @ symbol appears somewhere at or after the second character.

If those two checks are satisfied, the test function is called to see whether any disallowed characters appear in the field. If any of these tests fail, an error message is returned. The allowed characters in an email address are uppercase and lowercase letters, numbers, and the _, -, period, and @ characters, as detailed in the regular expression passed to the test method.

If no errors are found, the empty string is returned

to indicate successful validation. On the last line, the script and document are closed.

Javascript

noreply@blogger.com (renson) — Wed, 28 Jul 2021 04:47:00 +0000

JavaScript and HTML Text

JavaScript is a client-side scripting language that runs entirely inside the web browser.

To call it up, you place it between opening <script> and closing </script> HTML tags. A typical HTML “Hello World” document using JavaScript might look like:

“Hello World” displayed using JavaScript

<html>

 <head><title>Hello World</title></head>

 <body>

 <script type="text/javascript">

 document.write("Hello World")

 </script>

 <noscript>

 Your browser doesn't support or has disabled JavaScript

 </noscript>

 </body>

</html>

Explanation of the code

Using these tags is up to you, as they are not required, but you really ought to use them because it’s usually not that difficult to provide static HTML alternatives to the operations you provide using JavaScript. However, the remaining examples to come will omit <noscript> tags,

because we are focusing on what javascript can do.

Including JavaScript Files

In addition to writing JavaScript code directly in HTML documents, you can include files of JavaScript code either from your website or from anywhere on the Internet.

The syntax for this is as follows:

Debugging JavaScript Errors

When you’re learning JavaScript, it’s important to be able to track typing or other coding errors. Unlike PHP, which displays error messages in the browser, JavaScript handles error messages in a way that changes according to the browser used.

How to access JavaScript error messages in each of the most commonly used browser

Google Chrome: Click the menu icon that looks like a page with a corner turned; then select

Developer→JavaScript Console. You can also use the shortcut Ctrl-Shift-J on a PC, or Command Shift-J on a Mac.

Opera: Select Tools→Advanced→Error Console.

Functions

As with PHP, JavaScript functions are used to separate out sections of code that perform a particular task. To create a function, declare it in the manner shown in

A simple function declaration

function product(a, b)

{

return a*b

}

</script>

This function takes the two parameters passed, multiplies them together, and returns the product.

The program opens a window where we see

Type something here

a textbox and a button called ClickMe. We enter some text in the textbox, for example rbgtech. Then we click at the Button ClickMe. The method alert opens a dialog box and displays

The value of the textbox is: rbgtech

Then click OK to close the dialog box.

Real Life Example

<HTML>

<COMMENT> Function.html </COMMENT>

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

function sqrttable(myWindow)

{

myWindow.document.write("<B> Square Root Table </B><BR>");

myWindow.document.write("<HR>");

myWindow.document.write("<TABLE BORDER=1 CELLSPACING=5>");

myWindow.document.write("<TR><TD>Number</TD><TD>Squareroot</TD></TR>");

for(var i=1;i<=20;i++)

{

myWindow.document.write("<TR><TD>" + i + "</TD><TD>" + Math.sqrt(i) +

"</TD></TR>");

}

myWindow.document.write("</TABLE>");

myWindow.document.write("<HR>");

}

function display()

{

var dynWindow = window.open("","Title","width=200,height=300,scrollbars",

+ "resizable");

sqrttable(dynWindow);

}

</SCRIPT>

</HEAD>

<BODY>

<FORM name="Show it">

<input type=button value="show table" onClick="display()">

</FORM>

</BODY>

</HTML>

Explanation of the code

In the example above we show the use of two functions. The HTML commands to display a table of the square roots of the integers from 1 to 20 are embedded in the JavaScript code.

The Document Object Model(DOM)

Within JavaScript, there is a hierarchy of parent and child objects, which is what is known as the Document Object Model

DOM helps in modifying and reading links e.t.c

About document.write

It’s necessary to have a quick and easy way to display

the results of expressions. In PHP (for example) there are the echo and print statements, which simply send text to the browser, so that’s easy. In JavaScript, though,there are the following alternatives.

Using console.log

The console.log function will output the result of any value or expression passed to

it in the console of the current browser. This is a special mode with a frame or win‐

dow separate to the browser window, and in which errors and other messages can be

made to display

Using alert

The alert function displays values or expressions passed to it in a pop-up window,

which requires you to click a button to close.

Writing into Elements

It is possible to write directly into the text of an HTML element, which is a fairly elegant solution

Using document.write

The document.write function writes a value or expression at the current browser

location, and is therefore the perfect choice for quickly displaying results, because it

keeps all the examples short and sweet, by placing the output right there in the

browser next to the web content and code

Having gone through an overview of javascript,download some books already posted on Books Downloads tab to read more,the next publish will be implementing javascript and php keep following

SESSION IN WEB

noreply@blogger.com (renson) — Tue, 27 Jul 2021 05:29:00 +0000

Using Sessions

Sessions:These are groups of variables that are stored on the server but relate only to the current user. To ensure that the right variables are applied to the right users, PHP saves a cookie in the users’ web browsers to uniquely identify them.

This cookie has meaning only to the web server and cannot be used to ascertain any information about a user sessions provide a solid way of keeping track of your users.

Starting a session requires calling the PHP function session_start before any HTML has been output, similarly to how cookies are sent during header exchanges.

Then, to begin saving session variables, you just assign them as part of the $_SESSION array, like this:

$_SESSION['variable'] = $value;

They can then be read back just as easily in later program runs, like this:

$variable = $_SESSION['variable'];

Now assume that you have an application that always needs access to the username,

password, first name, and last name of each user, as stored in the table users, which you should have created a little earlier. So let’s further modify authenticate.php from

Setting a session after successful authentication

<?php //authenticate2.php
 require_once 'login.php';
 $connection =
 new mysqli($db_hostname, $db_username, $db_password, $db_database);
 if ($connection->connect_error) die($connection->connect_error);
 if (isset($_SERVER['PHP_AUTH_USER']) &&
 isset($_SERVER['PHP_AUTH_PW']))
 {
 $un_temp =
mysql_entities_fix_string($connection, $_SERVER['PHP_AUTH_USER']);
 $pw_temp = mysql_entities_fix_string($connection, $_SERVER['PHP_AUTH_PW']);
 $query = "SELECT * FROM users WHERE username='$un_temp'";
 $result = $connection->query($query);
 if (!$result) die($connection->error);
elseif ($result->num_rows)
 {
 $row = $result->fetch_array(MYSQLI_NUM);
 $result->close();
 $salt1 = "qm&h*";
$salt2 = "pg!@";
 $token = hash('ripemd128', "$salt1$pw_temp$salt2");
 if ($token == $row[3])
 {
 session_start();
 $_SESSION['username'] = $un_temp;
 $_SESSION['password'] = $pw_temp;
 $_SESSION['forename'] = $row[0];
 $_SESSION['surname'] = $row[1];
 echo "$row[0] $row[1] : Hi $row[0],
 you are now logged in as '$row[2]'";
 die ("<p><a href=continue.php>Click here to continue</a></p>");
 }
 else die("Invalid username/password combination");
 }
 else die("Invalid username/password combination");
 }
 else
 {
 header('WWW-Authenticate: Basic realm="Restricted Section"');
 header('HTTP/1.0 401 Unauthorized');
 die ("Please enter your username and password");
 }
 $connection->close();
 function mysql_entities_fix_string($connection, $string)
 {
 return htmlentities(mysql_fix_string($connection, $string));
 }
 function mysql_fix_string($connection, $string)
 {
 if (get_magic_quotes_gpc()) $string = stripslashes($string);
 return $connection->real_escape_string($string);
 }
?>

One other addition to the program is the “Click here to continue” link with a destination URL of continue.php. This will be used to illustrate how the session will transfer to another program or PHP web page. So create continue.php by typing/copying the program in Example below and saving it.

Retrieving session variables

<?php // continue.php
 session_start();
 if (isset($_SESSION['username']))
 {
$username = $_SESSION['username'];
 $password = $_SESSION['password'];
 $forename = $_SESSION['forename'];
 $surname = $_SESSION['surname'];
 echo "Welcome back $forename.<br>
 Your full name is $forename $surname.<br>
 Your username is '$username'
 and your password is '$password'.";
 }
 else echo "Please <a href='authenticate2.php'>click here</a> to log in.";
?>

Now you are ready to call up authenticate2.php into your browser. Enter a username of bsmith and password of mysecret (or pjones and acrobat) when prompted, and click the link to load in continue.php.

Explanation of the code:

Sessions neatly confine to a single program the extensive code required to authenticate and log in a user. Once a user has been authenticated, and you have created a session, your program code becomes very simple indeed. You need only to call up session_start and look up any variables to which you need access from $_SESSION.

A quick test of whether $_SESSION['username'] has a value is enough to let you know that the current user is authenticated, because session variables are stored on the server (unlike cookies, which are stored on the web browser)

and can therefore be trusted.

If $_SESSION['username'] has not been assigned a value, no session is active, so the

last line of code in Example above directs users to the login page at authenticate2.php.

Ending a Session

When the time comes to end a session, usually when a user requests to log out from your site, you can use the session_destroy function in association, as in

The example provides a useful function for totally destroying a session, logging a user out, and unsetting all session variables.

A handy function to destroy a session and its data

<?php
 function destroy_session_and_data()
 {
 session_start();
 $_SESSION = array();
 setcookie(session_name(), '', time() - 2592000, '/');
 session_destroy();
 }
?>
To see this in action, you could modify continue.php as in Example below:
 Retrieving session variables and then destroying the session
<?php
 session_start();
 if (isset($_SESSION['username']))
 {
 $username = $_SESSION['username'];
 $password = $_SESSION['password'];
 $forename = $_SESSION['forename'];
 $surname = $_SESSION['surname'];
 destroy_session_and_data();
 echo "Welcome back $forename.<br>
 Your full name is $forename $surname.<br>
 Your username is '$username'
 and your password is '$password'.";
 }
 else echo "Please <a href='authenticate2.php'>click here</a> to log in.";
 function destroy_session_and_data()
 {
 $_SESSION = array();
 setcookie(session_name(), '', time() - 2592000, '/');
 session_destroy();
 }
?>

Explanation of the code:

The first time you navigate from authenticate2.php to continue.php, it will display all the session variables. But, because of the call to destroy_session_and_data, if you

then click your browser’s Reload button, the session will have been destroyed and you’ll be prompted to return to the login page.

At this point,we have learnt enough on PHP and MYSQL we are going to learn on Javascript ,keep updated on our latest publish by following us.

Cookies and Authentication in web

noreply@blogger.com (renson) — Mon, 26 Jul 2021 06:13:00 +0000

Cookies, Sessions, and Authentication

As your web projects grow larger and more complicated, you will find an increasing need to keep track of your users. Even if you aren’t offering logins and passwords, you will still often need to store details about a user’s current session and possibly also recognize him/her when he/she returns to your site.

Several technologies support this kind of interaction, ranging from simple browser cookies to session handling and HTTP authentication.

Using Cookies in PHP

A cookie is an item of data that a web server saves to your computer’s hard disk via a web browser.

Importance of using cookies:

1.It helps in session tracking

2.Maintaining data across multiple visits

3.Holding shopping cart contents

4.Storing login details

Setting a Cookie

Setting a cookie in PHP is a simple matter. As long as no HTML has yet been transferred, you can call the setcookie function, which has the following syntax:

setcookie(name, value, expire, path, domain, secure, httponly);

name: The name of the cookie. This is the name that your server will use to access the

cookie on subsequent browser requests. e.g:Username

value :The value of the cookie, or the cookie’s contents. This can contain up to 4 KB of

alphanumeric text. eg:Hannah

expire (Optional) :Unix timestamp of the expiration date. Generally, you will probably use

time() plus a number of seconds. If not set, the cookie expires when the browser

closes.eg:time() + 2592000

path (Optional): The path of the cookie on the server. If this is a / (forward slash), the

cookie is available over the entire domain, such as www.rbgtech.blogspot.com If it is a

subdirectory, the cookie is available only within that subdirectory. The default is

the current directory that the cookie is being set in, and this is the setting you will

normally use. eg: /

domain (Optional):The Internet domain of the cookie.

So, to create a cookie with the name username and the value Hannah that is accessible across the entire web server on the current domain, and will be removed from the browser’s cache in seven days, use the following:

setcookie('username', 'Hannah', time() + 60 * 60 * 24 * 7, '/');

Accessing a Cookie

Reading the value of a cookie is as simple as accessing the $_COOKIE system array. For

example, if you wish to see whether the current browser has the cookie called user name already stored and, if so, to read its value, use the following:

if (isset($_COOKIE['username'])) $username = $_COOKIE['username'];

Note that you can read a cookie back only after it has been sent to a web browser.

This means that when you issue a cookie, you cannot read it in again until the browser reloads the page (or another with access to the cookie) from your website

and passes the cookie back to the server in the process.

Destroying a Cookie

To delete a cookie, you must issue it again and set a date in the past. It is important for all parameters in your new setcookie call except the timestamp to be identical to the parameters when the cookie was first issued; otherwise, the deletion will fail.

Therefore, to delete the cookie created earlier, you would use the following:

setcookie('username', 'Hannah', time() - 2592000, '/');

As long as the time given is in the past, the cookie should be deleted. However, I have used a time of 2,592,000 seconds (one month) in the past in case the client computer’s date and time are not correctly set.

HTTP Authentication

HTTP authentication uses the web server to manage users and passwords for the application. It’s adequate for most applications that ask users to log in.

PHP authentication example

<?php

if (isset($_SERVER['PHP_AUTH_USER']) &&

isset($_SERVER['PHP_AUTH_PW']))

{

echo "Welcome User: " . $_SERVER['PHP_AUTH_USER'] .

" Password: " . $_SERVER['PHP_AUTH_PW'];

}

else

{

header('WWW-Authenticate: Basic realm="Restricted Section"');

header('HTTP/1.0 401 Unauthorized');

die("Please enter your username and password");

}

How the code works:

The first thing the program does is look for two particular array values:

$_SERVER['PHP_AUTH_USER'] and $_SERVER['PHP_AUTH_PW'].

If they both exist, they represent the username and password entered by a user into an authentication

prompt

Basic realm is the name of the section that is protected and appears as part of the pop-up prompt:

WWW-Authenticate: Basic realm="Restricted Area"

If the user fills out the fields, the PHP program runs again from the top. But if the user clicks the Cancel button, the program proceeds to the following two lines, which send the following header and an error message:

HTTP/1.0 401 Unauthorized

The die statement causes the text “Please enter your username and password” to be displayed.

PHP authentication with input checking

<?php

$username = 'admin';

$password = 'letmein';

if (isset($_SERVER['PHP_AUTH_USER']) &&

isset($_SERVER['PHP_AUTH_PW']))

{

if ($_SERVER['PHP_AUTH_USER'] == $username &&

$_SERVER['PHP_AUTH_PW'] == $password)

echo "You are now logged in";

else die("Invalid username / password combination");

}

else

{

header('WWW-Authenticate: Basic realm="Restricted Section"');

header('HTTP/1.0 401 Unauthorized');

die ("Please enter your username and password");

}

Storing Usernames and Passwords

Obviously, MySQL is the natural way to store usernames and passwords. But again,we don’t want to store the passwords as clear text, because our website could be compromised if the database were accessed by a hacker. Instead, we’ll use a neat trick

called a one-way function.

This type of function is easy to use and converts a string of text into a seemingly random string.

So now I have moved on to using the PHP hash function, passing it a version of the ripemd algorithm, which was designed by the open academic community and which (like md5) returns a 32-character hexadecimal number—so it can easily replace md5

in most databases. Use it like this:

$token = hash('ripemd128', 'mypassword');

That example happens to give $token this value:

7b694600c8a2a2b0897c719958713619

Salting

Unfortunately, hash on its own is not enough to protect a database of passwords,because it could still be susceptible to a brute force attack that uses another database of known 32-character hexadecimal tokens. Such databases do exist, as a quick Google search will verify, although probably only for md5 and sha1 or sha2 at the moment.

Salting is simply a matter of adding some text that only we know about to each parameter to be encrypted, like this (with the salt highlighted in bold):

$token = hash('ripemd128', 'saltstringmypassword');

In this example, the text saltstring has been prepended to the password. Of course, the more obscure you can make the salt, the better. I like to use salts such as this:

$token = hash('ripemd128', 'hqb$tmypasswordcg*l');

Here some random characters have been placed both before and after the password.Given just the database, and without access to your PHP code, it should now be next to impossible to work out the stored passwords.

Let’s create a MySQL table to hold some user details and add a couple of accounts. So type and save the program in example below as setupusers.php, and then open it in your browser.

Creating a users table and adding two accounts:

 <?php // setupusers.php
 require_once 'login.php';
 $connection =
 new mysqli($db_hostname, $db_username, $db_password, $db_database);
 if ($connection->connect_error) die($connection->connect_error);
 $query = "CREATE TABLE users (
 forename VARCHAR(32) NOT NULL,
 surname VARCHAR(32) NOT NULL,
 username VARCHAR(32) NOT NULL UNIQUE,
 password VARCHAR(32) NOT NULL
 )";
 $result = $connection->query($query);
 if (!$result) die($connection->error);
 $salt1 = "qm&h*";
 $salt2 = "pg!@";
 $forename = 'Bill';
 $surname = 'Smith';
 $username = 'bsmith';
 $password = 'mysecret';
 $token = hash('ripemd128', "$salt1$password$salt2");

 add_user($connection, $forename, $surname, $username, $token);
 $forename = 'Pauline';
 $surname = 'Jones';
 $username = 'pjones';
$password = 'acrobat';
 $token = hash('ripemd128', "$salt1$password$salt2");

 add_user($connection, $forename, $surname, $username, $token);
 function add_user($connection, $fn, $sn, $un, $pw)
 {
 $query = "INSERT INTO users VALUES('$fn', '$sn', '$un', '$pw')";
 $result = $connection->query($query);
 if (!$result) die($connection->error);
 }
?>

PHP authentication using MySQL example

 <?php // authenticate.php
 require_once 'login.php';
 $connection =
 new mysqli($db_hostname, $db_username, $db_password, $db_database);
 if ($connection->connect_error) die($connection->connect_error);
 if (isset($_SERVER['PHP_AUTH_USER']) &&
 isset($_SERVER['PHP_AUTH_PW']))
 {
 $un_temp = mysql_entities_fix_string($connection, $_SERVER['PHP_AUTH_USER']);
 $pw_temp = mysql_entities_fix_string($connection, $_SERVER['PHP_AUTH_PW']);
 $query = "SELECT * FROM users WHERE username='$un_temp'";
 $result = $connection->query($query);
 if (!$result) die($connection->error);
 elseif ($result->num_rows)
 {
 $row = $result->fetch_array(MYSQLI_NUM);
$result->close();
 $salt1 = "qm&h*";
 $salt2 = "pg!@";
 $token = hash('ripemd128', "$salt1$pw_temp$salt2");

 if ($token == $row[3]) echo "$row[0] $row[1] :
Hi $row[0], you are now logged in as '$row[2]'";

 else die("Invalid username/password combination");
 }
 else die("Invalid username/password combination");
 }
 else
 {
 header('WWW-Authenticate: Basic realm="Restricted Section"');
 header('HTTP/1.0 401 Unauthorized');
 die ("Please enter your username and password");
 }
 $connection->close();

function mysql_entities_fix_string($connection, $string)
 {
 return htmlentities(mysql_fix_string($connection, $string));
 }
 function mysql_fix_string($connection, $string)
 {
 if (get_magic_quotes_gpc()) $string = stripslashes($string);
 return $connection->real_escape_string($string);
 }
?>

Explanation of the code

Now all that’s necessary is to check $token against the value stored in the database,which happens to be in the fourth column—which is column 3 when starting from 0.So $row[3] contains the previous token calculated for the salted password. If the two match, a friendly welcome string is output, calling the user by his or her first name.Otherwise, an error message is displayed.

PHP and MYSQL Web development

noreply@blogger.com (renson) — Sun, 25 Jul 2021 05:38:00 +0000

Querying a MySQL Database with PHP

The reason for using PHP as an interface to MySQL is to format the results of SQL queries in a form visible in a web page. As long as you can log into your MySQL installation using your username and password, you can also do so from PHP.

However, instead of using MySQL’s command line to enter instructions and view output, you will create query strings that are passed to MySQL. When MySQL returns its response, it will come as a data structure that PHP can recognize instead of the formatted output you see when you work on the command line. Further PHP com‐mands can retrieve the data and

format it for the web page

The Process of connecting MYSQL with PHP

The process of using MySQL with PHP is as follows:

1. Connect to MySQL and select the database to use.

2. Build a query string

3. Perform the query.

4. Retrieve the results and output them to a web page.

5. Repeat steps 2 to 4 until all desired data has been retrieved.

6. Disconnect from MySQL.

Creating a Login File

Most websites developed with PHP contain multiple program files that will require access to MySQL and will thus need the login and password details.

Therefore, it’s sensible to create a single file to store these and then include that file wherever it’s needed. Example:

<?php // login.php

$hn = 'localhost';

$db = 'publications';

$un = 'username';

$pw = 'password';

Type the example, replacing username and password with the values you use for your MySQL database, and save it to the document root directory We’ll be making use of the file shortly.The hostname localhost should work as long as you’re using a

MySQL database on your local system, and the database publications should work if you’re typing the same as the one in the xammp or any other local server you are using.

<?php and ?> tags mean that the lines between can be interpreted only as PHP code.

The $hn variable will tell PHP which computer to use when connecting to a database.

Connecting to a PHP MySQL Database

Now that you have the login.php file saved, you can include it in any PHP files that will need to access the database by using the require_once statement. This is preferable to an include statement, as it will generate a fatal error if the file is not found.

And believe me, not finding the file containing the login details to your database is a fatal error.

Also, using require_once instead of require means that the file will be read in only when it has not previously been included, which prevents wasteful duplicate disk accesses.

Connecting to a MySQL server with mysqli

<?php

require_once 'login.php';

$conn = new mysqli($hn, $un, $pw, $db);

if ($conn->connect_error) die($conn->connect_error);

This example creates a new object called $conn by calling a new instance of the mysqli method, passing all the values retrieved from the login.php file. Error checking is achieved by referencing the

$conn->connect_error property.

The -> operator indicates that the item on the right is a property or method of the object on the left. In this case, if connect_error has a value, then there was an error,so we call the die function and display that property, which details the connection error.

The $conn object is used in the following examples to access the MySQL database.

Building and executing a query

Sending a query to MySQL from PHP is as simple as issuing it using the query method of a connection

object.

Querying a database with mysqli

<?php

$query = "SELECT * FROM classics";

$result = $conn->query($query);

if (!$result) die($conn->error);

Here the variable $query is assigned a string containing the query to be made, and then passed to the query method of the $conn object, which returns a result that we place in the object $result. If $result is FALSE, there was a problem and the error property of the connection object will contain the details, so the die function is called to display that error.

All the data returned by MySQL is now stored in an easily interrogatable format in the $result object.

Fetching a result

Once you have an object returned in $result, you can use it to extract the data you want, one item at a time, using the fetch_assoc method of the object.

Fetching results one cell at a time

 <?php // query.php

 require_once 'login.php';

 $conn = new mysqli($hn, $un, $pw, $db);

 if ($conn->connect_error) die($conn->connect_error);

 $query = "SELECT * FROM classics";

 $result = $conn->query($query);

 if (!$result) die($conn->error);

 $rows = $result->num_rows;

 for ($j = 0 ; $j < $rows ; ++$j)

 {

 $result->data_seek($j);

 echo 'Author: ' . $result->fetch_assoc()['author'] . '<br>';

 $result->data_seek($j);

 echo 'Title: ' . $result->fetch_assoc()['title'] . '<br>';

 $result->data_seek($j);

 echo 'Category: ' . $result->fetch_assoc()['category'] . '<br>';

 $result->data_seek($j);

 echo 'Year: ' . $result->fetch_assoc()['year'] . '<br>';

 $result->data_seek($j);

 echo 'ISBN: ' . $result->fetch_assoc()['isbn'] . '<br><br>';

 }

 $result->close();

 $conn->close();

?>

Fetching a row

To fetch one row at a time, replace the for loop from Example above with the one highlighted in bold

Fetching results one row at a time

<?php //fetchrow.php

 require_once 'login.php';

 $conn = new mysqli($hn, $un, $pw, $db);

 if ($conn->connect_error) die($conn->connect_error);

 $query = "SELECT * FROM classics";

 $result = $conn->query($query);

 if (!$result) die($conn->error);

 $rows = $result->num_rows;

 for ($j = 0 ; $j < $rows ; ++$j)

 {

 $result->data_seek($j);

 $row = $result->fetch_array(MYSQLI_ASSOC);

 echo 'Author: ' . $row['author'] . '<br>';

 echo 'Title: ' . $row['title'] . '<br>';

 echo 'Category: ' . $row['category'] . '<br>';

 echo 'Year: ' . $row['year'] . '<br>';

 echo 'ISBN: ' . $row['isbn'] . '<br><br>';

 }

 $result->close();

 $conn->close();

?>

In this modified code, only one-fifth of the interrogations of the $result object are made (compared to the previous example), and only one seek into the object is made in each iteration of the loop, because each row is fetched in its entirety via the fetch_array method. This returns a single row of data as an array, which is then assigned to the array $row.

The fetch_array method can return three types of array according to the value

passed to it:

MYSQLI_NUM

Numeric array. Each column appears in the array in the order in which you defined it when you created (or altered) the table. In our case, the zeroth element of the array contains the Author column, element 1 contains the Title, and so on.

Querying a MySQL Database with PHP

MYSQLI_ASSOC

Associative array. Each key is the name of a column. Because items of data are referenced by column name (rather than index number), use this option where possible in your code to make debugging easier and help other programmers better manage your code.

MYSQLI_BOTH

Associative and numeric array.Associative arrays are usually more useful than numeric ones because you can refer to each column by name, such as$row['author'], instead of trying to remember where

it is in the column order. So this script uses an

associative array, leading us to pass

MYSQLI_ASSOC.

Closing a connection PHP will eventually return the memory it has allocated for objects after you have finished with the script, so in small scripts, you don’t usually need to worry about releasing memory yourself.

However, if you’re allocating a lot of result objects or fetching large amounts of data, it can be a good idea to free the memory you have been using to prevent problems later in your script.

This becomes particularly important on higher-traffic pages, because the amount of memory consumed in a session can rapidly grow. Therefore, note the calls to the close methods of the objects $result and $conn in the preceding scripts, as soon as each object is no longer needed, like this:

$result->close();

$conn->close();

A Practical Example

It’s time to write our first example of inserting data in and deleting it from a MySQL table using PHP.

 <?php // sqltest.php

 require_once 'login.php';

 $conn = new mysqli($hn, $un, $pw, $db);

 if ($conn->connect_error) die($conn->connect_error);

 if (isset($_POST['delete']) && isset($_POST['isbn']))

 {

 $isbn = get_post($conn, 'isbn');

 $query = "DELETE FROM classics WHERE isbn='$isbn'";

 $result = $conn->query($query);

 if (!$result) echo "DELETE failed: $query<br>" .

 $conn->error . "<br><br>";

 }

 if (isset($_POST['author']) &&

 isset($_POST['title']) &&

 isset($_POST['category']) &&

 isset($_POST['year']) &&

 isset($_POST['isbn']))

 {

 $author = get_post($conn, 'author');

 $title = get_post($conn, 'title');

 $category = get_post($conn, 'category');

$year = get_post($conn, 'year');

 $isbn = get_post($conn, 'isbn');

 $query = "INSERT INTO classics VALUES" .

 "('$author', '$title', '$category', '$year', '$isbn')";

 $result = $conn->query($query);

 if (!$result) echo "INSERT failed: $query<br>" .

 $conn->error . "<br><br>";

 }

 echo <<<_END

 <form action="sqltest.php" method="post"><pre>

 Author <input type="text" name="author">

 Title <input type="text" name="title">

 Category <input type="text" name="category">

 Year <input type="text" name="year">

 ISBN <input type="text" name="isbn">

 <input type="submit" value="ADD RECORD">

 </pre></form>

_END;

 $query = "SELECT * FROM classics";

$result = $conn->query($query);

 if (!$result) die ("Database access failed: " . $conn->error);

 $rows = $result->num_rows;

 for ($j = 0 ; $j < $rows ; ++$j)

 {

 $result->data_seek($j);

 $row = $result->fetch_array(MYSQLI_NUM);

 echo <<<_END

 <pre>

 Author $row[0]

 Title $row[1]

 Category $row[2]

 Year $row[3]

 ISBN $row[4]

 </pre>

 <form action="sqltest.php" method="post">

 <input type="hidden" name="delete" value="yes">

 <input type="hidden" name="isbn" value="$row[4]">

 <input type="submit" value="DELETE RECORD"></form>

_END;

 }

 $result->close();

 $conn->close();

 function get_post($conn, $var)

 {

 return $conn->real_escape_string($_POST[$var]);

 }

?>

N/B:The get_post function, passes each item it retrieves through thereal_escape_string method of the connection object to strip out any characters that

a hacker may have inserted in order to break into or alter your database, like this:

function get_post($conn, $var)

{

return $conn->real_escape_string($_POST[$var]);

}

Best Frontend Frameworks To learn in 2021

noreply@blogger.com (renson) — Fri, 23 Jul 2021 11:13:00 +0000

What is a framework?

.It is a universal, reusable software environment that provides particular functionality as part of a larger software platform to facilitate the development of software applications, products and solutions. Software frameworks may include support programs, compilers, code libraries, toolsets, and application programming interfaces (APIs) that bring together all the different components to enable development of a project or system.

Key features of a framework

1.In aframework,the overall program's flow of control is not dictated by the caller, but by the framework.

2.The framework code, in general, is not supposed to be modified, while accepting user-implemented extensions. In other words, users can extend the framework, but cannot modify its code

.Why we use frameworks for web development

1.Accelerated Development

One of the main advantages of using web frameworks is that you don’t need to write extensive lines of code. With a pre-defined template and an intuitive coding interface, developers can save hours of strenuous coding effort. Besides, frameworks offer quick prototyping, easy debugging, and real-time code changes to implement custom functionalities.

Best frontend frameworks

1.React

2.Angular

3.Vuejs

3.jQuery

4.Emberjs

5.Backbonejs

6.Semantic-UI

7.Foundation

8.Svelte

Top 3 Frontend Frameworks of 2021

The State of JavaScript 2019 concludes that React, Angular, and Vue are most popular among developers, which makes them the top three frontend frameworks of 2021 as well.

Reasons for their popularity:

1 React

One of the simplest frameworks to learn – React – was developed at Facebook to fix code maintainability issues due to the constant addition of features in the app. An open-source framework now, React stands out because of its virtual Document Object Model (DOM), which offers its exceptional functionality. An ideal framework for those who anticipate high traffic and need a stable platform to handle it.single-page web applications and PWAs.

.It works best when dealing with single-page web applications and PWAs projects.

Advantages

1.Reusability of components makes it easy to collaborate and reuse them in other parts of the application

2.Consistent and seamless performance with the use of virtual DOM

3.The best alternative to writing components in React hooks, it allows you to write components without classes and lets you learn React more easily

4.React dev tools are advanced and super useful

disadvantage

1.Due to multiple and constant updates in the framework, it is difficult to make the proper documentation and so does it impacts the learning curve for beginners

2.Developers find it hard to understand the complexities of JSX while beginning with the framework

3.It only gives frontend solutions

When to use React:

.React is used for building the user interface, especially when you want to develop single-page applications. It is the most robust frontend framework when you want to develop an interactive interface with less time since you can reuse the components.

When not to use React:

.When you don’t have hands-on experience with Javascript, React isn’t the recommended option. Also, for inexperienced developers, the JSX learning curve is a bit tough.

2. Angular

.Unlike React, Angular is unique with its two-way data binding feature. It means there is a real-time synchronization between the model and the view, where any change in the model reflects instantly on the view and vice versa.

.If your project involves building mobile or web apps, Angular is perfect! Besides, you can also use this framework to develop multi-page as well as progressive web apps.

.Compared to React, Angular is not easy to learn. Though there is innumerable documentation available, they are either too complex or confusing to read.

Advantages

1)In-built functionality to update the changes made in model to the view and so does vice-versa

2)Reduces the amount of code since most of the prominent features like two-way data binding are provided by default

3)Decouples the components from the dependencies by defining them external elements

4)Components are reusable and easy to manage using the dependency injection

5)A vast community for learning and support

disadvantages

1)Since Angular is the complete dynamic solution, there are multiple ways you can perform the task, so the learning curve is steeper. However, the large community of Angular makes it easy for new learners to learn about concepts and technology

2)It happens that dynamic apps don’t perform well sometimes because of their complex structure and size. However, code optimization and best practices of Angular

When to use Angular:

.Angular augments the performance of browser-based applications by dynamically updating the contents in no time since it uses two-way data binding. For enterprise based applications and dynamic web apps, using Angular is the best bet.

When not to use Angular:

.Angular is a complete solution as a frontend framework. If you want to build applications with limited scopes, you will not be able to use the resources that Angular provides. Also, when you have a more minor size team, opt for a smaller framework with fewer complexities and simple syntax.

3 Vuejs

Vue Js

One of the most popular front-end frameworks nowadays, Vue is a simple and straightforward framework. It is good at removing the complexities that Angular developers face. It is smaller in size and offers two major advantages – visual DOM and component-based. It is also a 2-way binding.

Vue is versatile, and it helps you with multiple tasks. From building web applications and mobile apps to progressive web applications, it can handle both simple and dynamic processes with ease.

Though it is built to optimize app performance and tackle complexities, it is not widely popular among market giants.

advantages

1)Extensive and detailed documentation

2)Simple syntax – programmers with the javascript background can easily get started with Vuejs

3)Flexibility to design the app structure

4)Typescript support

disadvantages:

1)Lack of stability in components

2)Relatively small community

3)Language barrier with plugins and components (most plugins written in Chinese language)

When to use:

.Vuejs is recommended for flexible design structures. It lets you design everything from scratch and is successful in developing giant projects as well.

When not to use:

.If you think the support community would be there to answer the complexities, Vuejs is not the right path to go. Also, the applications requiring stable components aren’t suitable to be built with Vuejs since the framework has shown problems with the stability of components.

I recommend you to subscribe to the newsletter to receive more updates

and comment on any subject you need to be included in the next publish@rbgtech.blogspot.com

How to validate and sanitize user input with php

noreply@blogger.com (renson) — Fri, 23 Jul 2021 09:06:00 +0000

Sanitizing User Input with PHP

.Now we return to PHP programming. It can never be emphasized enough that han‐

dling user data is a security minefield, and that it is essential to learn to treat all such

data with utmost caution from the word go. It’s actually not that difficult to sanitize

user input from potential hacking attempts, but it must be done.

.Therefore, you must never trust any variable that you fetch from either the $_GET or

$_POST arrays until you have processed it. If you don’t, users may try to inject Java‐

Script into the data to interfere with your site’s operation, or even attempt to add

MySQL commands to compromise your database.

.Therefore, instead of just using code such as the following when reading in user

input:

$variable = $_POST['user_input'];

For example, to pre‐

vent escape characters from being injected into a string that will be presented to

MySQL, use the following:

$variable = $connection->real_escape_string($variable);

.You will, however, still need to sanitize input when

including it within HTML.

.To get rid of unwanted slashes, use this:

$variable = stripslashes($variable);

And to remove any HTML from a string, use the following:

$variable = htmlentities($variable);

For example, this would change a string of interpretable HTML code like <b>hi</b>

into <b>hi</b>, which displays as text, and won’t be interpreted as

HTML tags.

.Finally, if you wish to strip HTML entirely from an input, use the following (but

ensure you use it before calling htmlentities, which replaces any angle brackets

used as part of HTML tags):

.$variable = strip_tags($variable);

In fact, until you know exactly what sanitization you require for a program,

Example below shows a pair of functions that brings all these checks together to pro‐

vide a very good level of security.

 
  <?php

function sanitizeString($var)

{

$var = stripslashes($var);

$var = strip_tags($var);

$var = htmlentities($var);

return $var;

}

function sanitizeMySQL($connection, $var)

{

$var = $connection->real_escape_string($var);

$var = sanitizeString($var);

return $var;

}

Real life Example Program

So let’s look at how a real-life PHP program integrates with an HTML form by creat‐

ing the program convert.php listed .Type it as shown and try it for

yourself.

. A program to convert values between Fahrenheit and Celsius

<?php // convert.php
 $f = $c = '';
 if (isset($_POST['f'])) $f = sanitizeString($_POST['f']);
 if (isset($_POST['c'])) $c = sanitizeString($_POST['c']);
if ($f != '')
 {
 $c = intval((5 / 9) * ($f - 32));
 $out = "$f °f equals $c °c";
 }
 elseif($c != '')
 {
 $f = intval((9 / 5) * $c + 32);
 $out = "$c °c equals $f °f";
 }
 else $out = "";
 echo <<<_END;
<html>
 <head>
 <title>Temperature Converter</title>
 </head>
 <body>
 <pre>
 Enter either Fahrenheit or Celsius and click on Convert
 <b>$out</b>
 <form method="post" action="convert.php">
 Fahrenheit <input type="text" name="f" size="7">
 Celsius <input type="text" name="c" size="7">
 <input type="submit" value="Convert">
 </form>
 </pre>
 </body>
</html>
_END;
 function sanitizeString($var)
 {
 $var = stripslashes($var);
 $var = strip_tags($var);
 $var = htmlentities($var);
 return $var;
 }
?>

PHP FORM HANDLING

noreply@blogger.com (renson) — Tue, 20 Jul 2021 07:13:00 +0000

PHP FORM HANDLING-rbgtech.blogspot.com

.To build a form, you must have at least the following elements:

a) An opening <form> and closing </form> tag

b) A submission type specifying either a Get or Post method

c) One or more input fields

d) The destination URL to which the form data is to be submitted

SIMPLE PHP FORM HANDLER

<?php // formtest.php
 echo <<<_END
 <html>
 <head>
 <title>Form Test</title>
 </head>
 <body>
 <form method="post" action="formtest.php">
 What is your name?
 <input type="text" name="name">
 <input type="submit">
 </form>
 </body>
 </html>
_END;
?>

N/B:Rather than dropping in and out of PHP code, the echo <<<_END..._END con‐

struct is used whenever multiline HTML must be output.

UPDATED VERSION OF formtest.php


<?php // formtest2.php
 if (isset($_POST['name'])) $name = $_POST['name'];
 else $name = "(Not entered)";
 echo <<<_END
 <html>
 <head>
 <title>Form Test</title>
 </head>
 <body>
 Your name is: $name<br>
 <form method="post" action="formtest2.php">
 What is your name?
 <input type="text" name="name">
 <input type="submit">
 </form>
 </body>
 </html>
_END;
?>





  
  
    
.The only changes are a couple of lines at the start that check the $_POST associative
array for the field name having been submitted
 .the $_POST associative array, which contains an element for each field in an HTML form
.The PHP isset function is used to test whether $_POST['name'] has been assigned a
value

<form method="post" action="calc.php"><pre>
 Loan Amount <input type="text" name="principle">
Monthly Repayment <input type="text" name="monthly">
 Number of Years <input type="text" name="years" value="25">
 Interest Rate <input type="text" name="rate" value="6">
 <input type="submit">
</pre></form>

THE INPUT TYPES
1)Text boxes
.It accepts a wide
range of alphanumeric text and other characters in a single-line box.
.The general for‐
mat of a text box input is as follows:
<input type="text" name="name" size="size" maxlength="length" value="value">


2)Text areas.When you need to accept input of more than a short line of text, use a text area. This
is similar to a text box, but, because it allows multiple lines, it has some different
attributes. Its general format looks like this:


<textarea name="name" cols="width" rows="height" wrap="type">
</textarea>


.To control the width and height, use the cols and rows attributes. Both use the char‐acter spacing of the current font to determine the size of the area. If you omit these
values, a default input box will be created that will vary in dimensions depending on
the browser used, so you should always define them to be certain about how your
form will appear.

3)Checkboxes
.When you want to offer a number of different options to a user, from which he can
select one or more items, checkboxes are the way to go. Here is the format to use:
<
  
input type="checkbox" name="name" value="value" checked="checked">
  
  
  
.If you wish to offer a newsletter to your readers when submitting
a form, you might want to have the checkbox already checked as the default value:
Subscribe?
    
 <input type="checkbox" name="news" checked="checked">
Offering multiple Checkboxes
Vanilla <input type="checkbox" name="ice" value="Vanilla">
 Chocolate <input type="checkbox" name="ice" value="Chocolate">
Strawberry <input type="checkbox" name="ice" value="Strawberry">


  4)Radio buttons
They are used when you want only a single value to be returned from a selection of
two or more options. All the buttons in a group must use the same name and,
because only a single value is returned, you do not have to pass an array.
For example, if your website offers a choice of delivery times for items purchased
from your store, you might use HTML like that.

      
8am-Noon<input type="radio" name="time" value="1">
Noon-4pm<input type="radio" name="time" value="2" checked="checked">
 4pm-8pm<input type="radio" name="time" value="3">
 
<select>
  
.The   <
     select> tag lets you create a drop-down list of options, offering either single or
multiple selections. It conforms to the following syntax:
<select name="name" size="size" multiple="multiple">
.The attribute size is the number of lines to display. Clicking on the display causes a
list to drop down, showing all the options. If you use the multiple attribute, a user
can select multiple options from the list by pressing the Ctrl key when clicking. So to
ask a user for his favorite vegetable from a choice of five, you might use HTML as in:
Vegetables

        

      <select name="veg" size="1">
 <option value="Peas">Peas</option>
 <option value="Beans">Beans</option>
 <option value="Carrots">Carrots</option>
 <option value="Cabbage">Cabbage</option>
 <option value="Broccoli">Broccoli</option>
</select>