كيفاش تصاوب blog ب nette framework الجزء الأول


فهاد المشروع غادي نشوفو كيفاش تصاوب blog ب nette framework لي هي وحدة من php frameworks لي كاينين وتصنفت أحسن ثالت php framework ف 2015 المشروع بسيط المستخدم كيستعرض المواضيع لي عندنا فقاعدة البيانات كيعلق عليها والأدمن كيزيد مواضيع وكيعدل أخرى.

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

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

أول حاجة غادي نديرو هي غادي نزيدو قاعدة بيانات جديدة ف phpmyadmin نسميوها blog-nette من بعد غادي نزيد فيها 2 ديال لtables نسميهم posts,comments هادي هي قاعدة البيانات لي غادي تمكنا من حفظ المواضيع لي غادي نزيدوها الكود باش تزيد الجداول فقاعدة البيانات هو :

                                --
-- Structure de la table `comments`
--
CREATE TABLE `comments` (
  `id` int NOT NULL AUTO_INCREMENT PRIMARY KEY,
  `post_id` int(11) NOT NULL,
  `name` varchar(250) NOT NULL,
  `email` varchar(250) NOT NULL,
  `body` text NOT NULL,
  `created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
  FOREIGN KEY (`post_id`) REFERENCES `posts` (`id`)
) ENGINE=InnoDB CHARSET=utf8;

--
-- Structure de la table `posts`
--
CREATE TABLE `posts` (
  `id` int(11) NOT NULL AUTO_INCREMENT PRIMARY KEY,
  `title` varchar(255) NOT NULL,
  `body` text NOT NULL,
  `created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP
) ENGINE=InnoDB CHARSET=utf8;
                            

2- تحميل Nette

أول شيء غادي تديرو هو تثبيت composer لي غادي يمكنك من تثبيت nette يمكنلك تبحث عليه فغوغل وتحملو من الموقع الرسمي من بعد غادي تفتح cmd غادي نكتب الأمر cd c:/wamp/www من بعد غادي تديرالأمر composer create-project nette/blog الإسم ديال المشروع هو blog من بعد ما يتزاد المجلد ف wamp/www فهنا أنا خدام بwamp كنتي خدام بxampp سير ل htdocs ولا easyphp سير ل www منبعد باش تربط الإتصال بقاعدة البيانات غادي تمشي ل app/config/config.local.neon وغادي تدير تعديلات على الكود غادي تزيد سمية قاعدة البيانات لي زدتي فphpmyadmin ولusername لي هو root وكلمة المرور الكود ديال الملف ملي تغير هو :

                                database: 	
dsn: 'mysql:host=127.0.0.1;dbname=blog-nette' 	
user: root 	
password:
                            

3- الصفحة الأساسية

فالصفحة لي غادي تكون هي الأساس ديال كل الصفحات وغادي يكون فيها روابط css وjavascript والقائمة ديال التصفح هي layout.latte@ وفالقائمة كاين accueil لي كتدي لل controller Homepage وللصفحة default لي هي ديال هاد controller غادي نزيدوها من بعد ثم كاين Connexion لي كتدي لل controller Sign وللصفحة in لي هي ديال هاد controller والرابط كيبان فقط يلا كان المستخدم ممكونيكطيش ثم كاين Déconnexion لي كتدي لل controller Sign ولل fonction out لي كتمكن المستخدم باش يديكونيكطا والرابط كيبان فقط يلا كان المستخدم مكونيكطي والباقي كاين لflash messages لي هي رسائل النجاح والفشل الكود ديال الملف هو :

                                <!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>{ifset title}{include title|stripHtml} | {/ifset}Blog Nette</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
  {block head}
      <style>
         body{
           margin:0;
           padding:0
           line-height:1.5;
           background:#fff;
           color:#000;
           font-size:13px
           font-family:verdana;
         }
         input {
            padding:10px;
            margin-bottom:5px;
            margin-top:5px;
         }
         .post{
             padding:10px;
         }
         form{
           margin-top:30px;
           margin-bottom:5px;
         }
         .flash{
           margin:20px;
           font-size:20px;
           align:center;
           color:#FF9944;
         }
      </style>
  {/block}
</head>

<body>
	<nav class="navbar navbar-default">
      <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="#">Nette Blog</a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a n:href="Homepage:default">Accueil</a></li>
            <li><a n:href="Sign:in" n:if="!$user->loggedIn">Connexion</a></li>
            <li><a n:href="Sign:out" n:if="$user->loggedIn">Déconnexion</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </nav>
	<div " n:foreach="$flashes as $flash" n:class="flash, $flash->type">{$flash->message}</div>
	{include content}
	{block scripts}
	<script src="https://nette.github.io/resources/js/netteForms.min.js"></script>
	{/block}
</body>
</html>
                            

4- الملف HomepagePresenter.php

فapp/presenters كاين لcontrol الرئيسي ديالنا لي هو HomepagePresenter.php ولي فيه constructeur لي كاياخد قاعدة البيانات لي سبق وديرنا الإتصال بها فالملف app/config/config.local.neon ثم كاين ل fonction renderDefault لي منبعد مكتسترجع 5 من المواضيع لي عندنا فالجدول posts كترسلهم للملف default لي عندنا فالمجلد Homepage ولي غادي يكون هو الصفحة الرئيسية لي كتعرض آخر المواضيع لي تزادو الكود ديال الملف هو :

                                    <?php

namespace App\Presenters;

use Nette;


class HomepagePresenter extends Nette\Application\UI\Presenter
{
    private $database;
    function __construct(Nette\Database\Context $database){
        $this->database = $database;
    }
    public function renderDefault()
    {
        $this->template->posts = $this->database->table('posts')
        ->order('created_at DESC')
        ->limit(5);
    }
}

                                


إشترك في قناتنا على اليوتيوب

بحث في الموقع


إشترك للتوصل بالجديد