مشروع Photos Gallery بل PHP الجزء الأول

منذ 5 سنوات imadbelasri PHP
PH

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


نظرة سريعة بالفيديو


- إنشاء قاعدة البيانات

أول حاجة غادي تمشي لphpmyadmin وغادي تزيد قاعدة بيانات جديدة تسميها gallery_opp من بعد غادي تزيد فيها 3 ديال الجداول واحد ديال المستخدمين سميتو users واحد خاص بالصور سميه photos والآخير ديال التعاليق سميه comments الكود ديال إنشاء قاعدة البيانات هو :

                                                    
                                                        -- Structure de la table `comments`
--

CREATE TABLE IF NOT EXISTS `comments` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `photo_id` int(11) NOT NULL,
  `user_id` int(11) NOT NULL,
  `comment` text NOT NULL,
  `date` datetime NOT NULL,
  PRIMARY KEY (`id`),
  KEY `photo_id` (`photo_id`,`user_id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=33 ;

-- --------------------------------------------------------

--
-- Structure de la table `photos`
--

CREATE TABLE IF NOT EXISTS `photos` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `title` varchar(255) NOT NULL,
  `description` text NOT NULL,
  `filename` varchar(255) NOT NULL,
  `type` varchar(255) NOT NULL,
  `size` int(11) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=18 ;
--
-- Structure de la table `users`
--

CREATE TABLE IF NOT EXISTS `users` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `pseudo` varchar(255) NOT NULL,
  `nom` varchar(255) NOT NULL,
  `prenom` varchar(255) NOT NULL,
  `passe` varchar(255) NOT NULL,
  `filename` varchar(255) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=20 ;


                                                    
                                                

- الملفات الأساسية

من بعد غادي تمشي لwamp يلا كنتي خدام به و منبعد تمشي للمجلد www وتزيد مجلد جديد تسميه PhotoGalleryOPP ولي غادي تزيد فيه واحد المجلد غادي تسميه admin فهاد المجلد غادي تزيد 4 ديال المجلدات css و js و includes و fonts من بعد غادي تمشي للموقع http://fontawesome.io وغادي تحمل font-awsome وغادي تزيد المجلد فadmin منبعد غادي تقوم بتحميل bootstrap وغادي تزيد الملف bootstrap.min.css ف css والملف bootstrap.min.js ف js و الملفات لي فالمجلد fonts ف fonts من بعد غادي تزيد ملف تسميه header.php و آخر تسميه footer.php وآخر تسميه navigation.php و config.php تزيدهم فincludes الملف config.php غادي يكونو فيه لvariables لي غادي يمكنو من الإتصال بقاعدة البيانات الكود ديالو هو :

                                                        
                                                            <?php

define('DB_HOST','localhost');
define('DB_USER','root');
define('DB_PASSWORD','');
define('DB_DATABASE','gallery_opp');
                                                        
                                                    

- الملف header.php

هاد الملف غادي يكون هو الأساس ديال كل الصفحات الخاصة بجهة الأدمن ولي غادي يربط ملفات css بالملفات ديالنا.

                                                        
                                                            <?php
include "init.php";
?>
<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Photo Gallery</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/main.css" rel="stylesheet">
    <link href="font-awsome/css/font-awesome.css" rel="stylesheet">
  </head>
  <body>
                                                        
                                                    

- الملف footer.php

هاد الملف غادي يكون هو الأساس ديال كل الصفحات الخاصة بجهة الأدمن ولي غادي يربط ملفات js بالملفات ديالنا.

                                                        
                                                            <footer>
      <p>© 2016 Darija Coding</p>
</footer>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="http://cdn.tinymce.com/4/tinymce.min.js"></script>
    <script src="js/scripts.js"></script>
  </body>
</html>
                                                        
                                                    

- الملف navigation.php

هاد الملف غادي تكون فيه القائمة لي غادي تمكن من تصفح جميع الصفحات.

                                                        
                                                                <nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="index.php">Admin</a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a href="users.php">Utilisateurs</a></li>
            <li><a href="photos.php">Photos</a></li>
            <li><a href="upload.php">Télécharger une photo</a></li>
            <li><a href="comments.php">Commentaires</a></li>
            <?php if(isset($_SESSION['user_id'])):?>
              <li><a href="logout.php">Déconnexion</a></li>
            <?php endif; ?>
          </ul>
        </div>
      </div>
    </nav>
                                                        
                                                    

دروس ذات صلة

PH

مشروع Photos Gallery بل PHP الجزء الثاني

فهاد الجزء الثاني غادي نقادو الملفات لي غادي يمكننا من ربط الإتصال بقاعدة البيانات وغادي نزيدو الملف...


PH

مشروع Photos Gallery بل PHP الجزء الثالث

فهاد الجزء الثالث من المشروع ديالنا غادي نكملو الملفات لي غادي يمكنو من التعامل مع المعلومات الخاصة...


PH

مشروع Photos Gallery بل PHP الجزء الرابع

فهاد الجزء الرابع من هاد المشروع غادي نكملو الملفات لي غادي يمكنو المستخدم من التسجيل وأيضا من تسجيل...


PH

مشروع Photos Gallery بل PHP الجزء الخامس

فهاد الجزء الخامس من المشروع ديالنا غادي نكملو الملفات ديال تعديل وحذف مستخدم ومنبعد غادي نزيدو الم...


PH

مشروع Photos Gallery بل PHP الجزء السادس

فهاد الجزء من المشروع ديالنا غادي نزيدو الملفات الخاصة بعرض الصور لي عندنا فقاعدة البيانات والتعليقا...


PH

مشروع Photos Gallery بل PHP الجزء السابع

فهاد الجزء من هاد المشروع غادي نكملو الملفات الخاصة بالواجهة لي غادي تكون مرئية للزوار ديالنا أول حا...


PH

مشروع Photos Gallery بل PHP الجزء الثامن

فهاد الجزء الثامن والأخير من هاد المشروع غادي نزيدو الملفات لي غادي تمكن من عرض الصور وعرض صورة والم...