PHP Social App

Develop Socila App Using HTML,CSS,JS and PHP

Created byMohamed Saad

Last updated 8/2016

Arabic

What you'll learn

Develop Client side and Server side Functions
Validate User Data In Run Time
Manipulate Mysql Database
Embed Different Languages to Develop Web Applications
Analyse Project using Flow Charts
Send Files to Server
Create Protected Contents

Course content

18 sections • 86 lectures • 6h 13m total length

Big PHP Application5:37
Flow Charts7:13

Create database table using PHP MyAdmin + WAMP1:54
Create database table using - Go Daddy Hosting0:46
Connect Dreamweaver with WAMP Server3:58
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Register</title>
</head>
<body>
<form action="" method="post">
Username: <input type="text" name="username" id="username"><br>
Password: <input type="password" name="password" id="password"><br>
Cofirm Password: <input type="password" name="conf-password" id="conf-password"><br>
Email: <input type="text" name="email" id="email"><br>
Confirm Email: <input type="text" name="conf-email" id="conf-email"><br>
<input type="submit" name="regiter" value="Register">
</form>
</body>
</html>
WAMP & Dreamweaver

Manipulate Registration Data7:13
<?php
//connect to pami
$con=mysqli_connect("localhost","root","","pami");
if($con){
echo "Connected";
if(isset($_POST['regiter'])){
//store input data in php variables
$username=$_POST['username'];
$password=$_POST['password'];
$email=$_POST['email'];
}//isset block
}else{
die("Connection Error:".mysqli_connect_error());
}//connection block
?>
Write to Database (Register)3:09
$sql="INSERT INTO `users` (`username`,`password`,`email`)
VALUES('$username','$password','$email')";
mysqli_query($con,$sql);
mysqli_close($con);
Read From Database (Signin)3:51
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Signin</title>
</head>

<body>
<form action="" method="post">
User Or Email: <input type="text" name="user" />
Password: <input type="password" name="password" />
<input type="submit" name="signin" value="Sign In" />
</form>
<?php
if(isset($_POST['signin'])){
$con=mysqli_connect("localhost","root","","pami");
$username=$_POST['user'];
$password=$_POST['password'];
$email=$_POST['user'];
$sql="SELECT `id` FROM `users` WHERE (`username`='$username' OR `email`='$email') AND `password`='$password'";
$result=mysqli_query($con,$sql);
while ($row=mysqli_fetch_row($result)){
print_r($row);
echo "User ID: ".$row[0];
}//end while
mysqli_free_result($result);
mysqli_close($con);
}//end signin
?>
</body>
</html>
Create Protected Area3:33
******** signin.php
<?php session_start()?>
//print_r($row);
//echo "User ID: ".$row[0];
$_SESSION['id']=$row[0];
header("Location:dashboard.php");
******** dashboard.php
<?php session_start();?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Dashboard</title>
</head>

<body>
<?php
if( $_SESSION['id']!=""){
echo "Successfuly Signed In";
$_SESSION['id']="";
}else{
echo "Protected Contents you have to signin...!";
}
?>
</body>
</html>
PHP Connection with MySQL

Upload User Pic4:06
Send Variables in URL4:12
*********** Dashboard.php
<?php session_start();?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Dashboard</title>
</head>

<body>
<?php
if( $_SESSION['id']!=""){

echo "Successfuly Signed In";
$id=$_SESSION['id'];
?>
<ul>
<li><a href="profile.php?id=<?php echo $id; ?>" title="Profile">Profile</a></li>
<li><a href="edit-profile.php?id=<?php echo $id; ?>" title="Edit Profile">Edit Profile</a></li>
<li><a href="signout.php" title="Sign Out">Sign Out</a></li>
</ul>
<?php
$_SESSION['id']="";

}else{
echo "Protected Contents you have to signin...!";?>
<a href="signin.php" title="Sign In">Sign In</a>
<?php
}
?>
</body>
</html>
******************** profile.php
<?php
if($_GET['id']!=""){
echo "User Profile<br><hr>";
}//end if
?>
********************
Rename Uploaded File3:26
Manipulate Remember Me3:32
COOKIE Variable3:34
Edit Table Structure4:56
Profile Page8:33
File Upload , Variables , SQL

Send Friendship Request7:07
users.php Complete ***************************************************

<style>
#user {
width:10%;
float:left;
display:block;
background:#9F9;
margin:10px;

}
</style>
<?php
include ('functions.php');
echo $my_id=$_COOKIE['id'];
$con=connect();

$sql="SELECT `id`,`ext`,`username` FROM `users`";
$result =mysqli_query($con,$sql);
while($row=mysqli_fetch_assoc($result)){
if($my_id!=$row['id']){

//***************************************************************************************
//***************************************************************************************

$user_id=$row['id'];
$sqlx="SELECT `chiled_user` FROM `friends` WHERE `parent_user`='$my_id ' AND `chiled_user`='$user_id'";
$resultx =mysqli_query($con,$sqlx);
$hide_userx=mysqli_num_rows($resultx);
if($hide_userx==0){

//***************************************************************************************
//***************************************************************************************

$user=$row['username'];
$pic='users-pic/'.$row['id'].'.'.$row['ext'];
?>
<div id="user">

<p align="center"><img src="<?php echo $pic; ?>" title="<?php echo $user; ?>" width="42" height="42"><br><?php echo $user; ?>

</p>
</div>
<?php
}//end if

}//end if -dont output current client
}//end while

?>

<script src="js/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){

//-------------------------------------username-----------------------------------
var x_timer;
$("#username").keyup(function (e){
clearTimeout(x_timer);
var username = $(this).val();
x_timer = setTimeout(function(){
check_username_ajax(username);
}, 300);
});

function check_username_ajax(username){
$("#user-result").html('<img src="ajax-loader.gif" />');
$.post('x.php', {'username':username}, function(data) {
$("#user-result").html(data);
});
}
//----------------------------------------------------------------------------------
});
</script>
<div style="width:100%; clear:both">
<form action="" method="post">
<div id="registration-form">
<label for="username">Enter Username :
<input name="username" type="text" id="username" maxlength="15"> <span id="user-result"></span>
</label>
<input type="submit" name="submit" value="Send Friendship Requist" />
</form>
</div>
</div>
<?php

if (isset($_POST['submit'])){
$con=connect();
$username=$_POST['username'];
$sql="SELECT `id` FROM `users` WHERE `username`='$username'";
$result=mysqli_query($con,$sql);
while($row=mysqli_fetch_assoc($result)){
$frnd_id=$row['id'];
$sql_ins="INSERT INTO `pami`.`friends`
(`parent_user` ,`chiled_user`,`state`,`username`)VALUES
('$my_id', '$frnd_id','0','$username')";

$search="SELECT `id` FROM `friends` WHERE `chiled_user`='$frnd_id' AND `parent_user`='$my_id' ";
$result_search=mysqli_query($con,$search);
$x=mysqli_num_rows($result_search);
if($x==0){
mysqli_query($con,$sql_ins);
header("Location:users.php");
}else{
echo "<p style='color:red'>You already have this person in your contacts</p>";
}//end current friend
}//end while
}//end submit
mysqli_close($con);
?>
JQuery Validation2:30
Download JQuery Library : https://jquery.com/download/

Save file locally on js folder

Register.php*****************Lesson 33 to 35**********************

<script src="js/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){

$('#email').keyup(function(e){
$(this).val($(this).val().replace(/\s/g, ''));
var email = $(this).val();
if(email.length <6){
$("#user-email").html('<img src="imgs/not-available.png" />');}
else
{$("#user-email").html('<img src="imgs/ajax-loader.gif" />');}
})
//-------------------------------------username-----------------------------------
var x_timer;
$("#username").keyup(function (e){
clearTimeout(x_timer);
var username = $(this).val();
x_timer = setTimeout(function(){
check_username_ajax(username);
}, 1000);
});

function check_username_ajax(username){
$("#user-result").html('<img src="ajax-loader.gif" />');
$.post('process.php', {'username':username}, function(data) {
$("#user-result").html(data);
});
}
//----------------------------------------------------------------------------------

//-------------------------------------email-----------------------------------
var timer;
$("#email").keyup(function (e){
clearTimeout(timer);
var email = $(this).val();
timer = setTimeout(function(){
check_email_ajax(email);
}, 1000);
});

function check_email_ajax(email){
$("#user-email").html('<img src="ajax-loader.gif" />');
$.post('process.php', {'email':email}, function(data) {
$("#user-email").html(data);
});
}
//----------------------------------------------------------------------------------

});
</script>
Email Validation3:10
<form action="" method="post">
<div id="registration-form">
<label for="username">Enter Username :
<input name="username" type="text" id="username" maxlength="15"> <span id="user-result"></span>
</label>
</div>
Password: <input type="password" name="password" id="password"><br>
Cofirm Password: <input type="password" name="conf-password" id="conf-password"><br>
Email: <input type="text" name="email" id="email"><span id="user-email"></span><br>
Confirm Email: <input type="text" name="conf-email" id="conf-email"><br>
<input type="submit" name="regiter" value="Register">
</form>
Validate Username against database (AJAX)6:59
Process.php*******************************************************
<?php
include('functions.php');
$con=connect();
if(isset($_POST['username'])){
$username=$_POST['username'];
$sql ="SELECT `username` FROM `users` WHERE `username`='$username'";
$result=mysqli_query($con,$sql);
//echo
$x=mysqli_num_rows($result);
if($x==0){
echo('<img src="imgs/available.png">');

}else if ($x==1){
echo('<img src="imgs/not-available.png">');
}

}
if(isset($_POST['email'])){
$email=$_POST['email'];
$sql ="SELECT `email` FROM `users` WHERE `email`='$email'";
$result=mysqli_query($con,$sql);
//echo
$x=mysqli_num_rows($result);
if($x==0){
echo('<img src="imgs/available.png">');

}else if ($x==1){
echo('<img src="imgs/not-available.png">');
}

}
mysqli_close($con);

?>
Redo With Email3:00
Interactive Text Box3:10

Process AJAX Request17:10
Display Friends List12:15
Dashboard.php ********Complete*********lesson 41+42**

<style>
#frnd {
width: 7%;
display: block;
float: right;
}
.user {
display: block;
background: #993;
margin: 10px;
border-radius: 90px;
box-shadow: 1px 1px 1px #333;
padding: 5px;
}
.user p img {
border-radius: 90px;
box-shadow: 1px 1px 1px #fff;
}
</style>
<?php include('functions.php'); ?>

<body>
<?php
if( isset($_COOKIE['id'])){
//echo "Successfuly Signed In";
$id=$_COOKIE['id'];
head();
$con=connect();

$sql="SELECT `chiled_user` FROM `friends` WHERE `parent_user`='$id' AND `state`='1'";

$result=mysqli_query($con,$sql);
echo "<div id='frnd'><br>";

echo "<p align='center'>Friends List</p>";
while($row=mysqli_fetch_assoc($result)){
$chiled_id= $row['chiled_user'];
$sql_frnd="SELECT `id`,`ext`,`username` FROM `users` WHERE `id`='$chiled_id'";
$frnd_result=mysqli_query($con,$sql_frnd);
while($frnd_row=mysqli_fetch_assoc($frnd_result)){
$pic='users-pic/'.$frnd_row['id'].'.'.$frnd_row['ext'];
$username=$frnd_row['username'];
?>
<div class="user">
<p align="center">
<img src="<?php echo $pic; ?>" title="<?php echo $username; ?>" width="42" height="42">
<br><?php echo $username; ?>
</p>
</div>
<?php
}//end friend list loop
}//end while row
echo "</div>";//end of frnd diversion
}else{
echo "Protected Contents you have to signin...!";?>
<a href="signin.php" title="Sign In">Sign In</a>
<?php
}
?>
</body>
</html>
Set back and relax1:19

Requirements

HTML
CSS

Description

دبلومة االبي اتش بي التي سوف تمكنك من أحتراف البرمجة بلغة البي اتش بي , كما سوف نتناول جميع الأكواد المكملة لأنشاء مشروع متكامل و هذا يتمثل في

MySQL [SQL] , HTML , CSS , JavaScript [ JQuery & AJAX ]

الدراسة عن طريق دروس فيديو مصحوبة بملفات المشاريع حتى توفر عليك عناء الكتابة و لكني أنصح بأستخدام هذه الملفات كمرجع عندما تواجة مشاكل في الكتابة لا تعرف سببها .

هذا التدريب الغرض منة مساعدتك على الانتقال من مبرمج هاوى الي مبرمج محترف يستطيع تحليل و تصميم و برمجة مشاريع متكاملة و هذه الخلفية هي اساس للعمل في حقل البرمجة حيث انك سوف تدرس من خلالها المفاهيم البرمجية المختلفة.

أصبحت لغة البي أتش بي من أهم اللغات لبرمجة تطبيقات الانترنت لعدة اسباب لعل من أهمها

كل مصادر البي أتش بي مجانية
لغة الاوسع انتشاراً حيث ان اكثر من 80% من مواقع الانترنت حاليا تستخدم فيها البي اتش بي
قاعدة عريضة من المطورين مما يجعل اللغة في تطور مستمر
أنتشار عدة مصادرمجانية (راجع دوراتي) تساعد على تعلم اللغة
وجود العديد من المكتبات التي تجعل الامور المعقدة في غاية البساطة
.غة بناء الوردبريس و جوملا و في تيجر و هذه هي الانظمة الاوسع أنتشاراً في سوق العمل
أسلوب كتابة البي اتش بي مشابة للغات متعددة مثل الجافا اسكربت مما يجعل تعلمك لأي لغة أخرى في غاية البساطة
سهولة دمج البي أتش بي مع لغات الويب الأخرى مثل أتش تي أم أل - جافا سكربت -سي اس اس.
.بأستخدام جمل سيكول بسيطة يمكنك دمج مشروعك مع قاعدة بيانات مايسيكول المجانية ايضاً
كمية هائلة من الدوال التي يمكنها ان تتحكم و تعالج أي نوع من أنواع البيانات
مع البي أتش بي أنت و خيالك و وقتك فقط من يضع الحدود
العديد من الاستضافات المجانية و بدون اعلانات يعمل عليها احدث اصدارات بي اتش بي
حتى الاستضافات المجانية تمنح لك الحق في التحكم في البي اتش بي و كيفية عملة من خلال ما يسمى (php.ini)

هذا التدريب سوف يحتاج منك لبعض الوقت فنحن بصدد الكثير من العمل و لكن ما يهون هذه الرحلة هي النتائج المزهلة التي سوف تحصل عليها خلال العمل.

Who this course is for:

Novice programmers
Computer Science Students
Software Engineers
Web Developers

PHP Social App

What you'll learn

Explore related topics

Course content

Introduction2 lectures • 13min

Data Base And Project Initiation3 lectures • 7min

Login System4 lectures • 18min

User Pictuer7 lectures • 32min

Efficient Coding3 lectures • 9min

User Menu8 lectures • 30min

Smart Page Title3 lectures • 7min

Edit Profile5 lectures • 21min

Validation6 lectures • 26min

Connect With Other Users3 lectures • 31min

Requirements

Description

Who this course is for: