كيفاش تصاوب موقع ecommerce ب codeigniter الجزء الأول


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

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

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

أول حاجة غادي نديرو هي غادي نزيدو قاعدة بيانات جديدة ف phpmyadmin نسميوها gamingshop من بعد غادي نزيد فيها 3 ديال لtables نسميهم users,categories,products هادي هي قاعدة البيانات لي غادي تمكنا من حفظ المنتوجات لي غادي نزيدوها الكود باش تزيد الجداول فقاعدة البيانات هو :

                                --
-- Structure de la table `categories`
--

CREATE TABLE IF NOT EXISTS `categories` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `name` varchar(255) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=0;
--
-- Structure de la table `products`
--

CREATE TABLE IF NOT EXISTS `products` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `titre` varchar(255) NOT NULL,
  `description` text NOT NULL,
  `prix` decimal(10,0) NOT NULL,
  `image` varchar(200) NOT NULL,
  `categorie_id` int(11) NOT NULL,
  `sold` int(11) NOT NULL,
  PRIMARY KEY (`id`),
  KEY `categorie_id` (`categorie_id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=0;

--
-- Structure de la table `users`
--

CREATE TABLE IF NOT EXISTS `users` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `nom` varchar(100) NOT NULL,
  `prenom` varchar(100) NOT NULL,
  `email` varchar(100) NOT NULL,
  `pseudo` varchar(100) NOT NULL,
  `password` varchar(64) NOT NULL,
  `date_insc` timestamp NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=0 ;


                            

2- تحميل Codeigniter

ثاني حاجة غادي نديروها هي تحميل Codeigniter من الموقع الإلكتروني https://www.codeigniter.com/download من بعد غادي تهز المجلد لي حملتي وغادي تحطو فc:wamp/www وتسميه gamingshop باش تشوف الصفحة ديال الترحيب غادي تمشي للمتصفح ديالك http://localhost/gamingshop/index.php باش نحيدو داك index.php من الرابط ديالنا غادي نزيدو واحد الملف سميتو htaccess. فالمجلد ديال المشروع لي هوgamingshop وغادي نزيدو فيه الكود التالي :

                                <IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /gamingshop/
RewriteCond %{REQUEST_URI} ^system.*
RewriteRule ^(.*)$ /index.php?/$1 [L]
RewriteCond %{REQUEST_URI} ^application.*
RewriteRule ^(.*)$ /index.php?/$1 [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php?/$1 [L]
</IfModule>
                            

3- ربط الإتصال بقاعدة البيانات

باش تربط الإتصال بقاعدة البيانات غادي تمشي ل application/config/database.php وغادي تدير تعديلات على الكود :

                                $db['default'] = array(
	'dsn'	=> '',
	'hostname' => 'localhost',
	'username' => 'root',
	'password' => '',
	'database' => 'gamingshop',
	'dbdriver' => 'mysqli',
	'dbprefix' => '',
	'pconnect' => FALSE,
	'db_debug' => (ENVIRONMENT !== 'production'),
	'cache_on' => FALSE,
	'cachedir' => '',
	'char_set' => 'utf8',
	'dbcollat' => 'utf8_general_ci',
	'swap_pre' => '',
	'encrypt' => FALSE,
	'compress' => FALSE,
	'stricton' => FALSE,
	'failover' => array(),
	'save_queries' => TRUE
);

                            

4- الصفحات الأساسية

غادي تمشي لviews من بعد تزيد مجلد جديد تسميه layouts فيه غادي تزيد مجلد تسميه includes فهاد المجلد غادي تزيد ملف تسميه header.php لي غادي يكون أساس كل الصفحات وفيه روابط لملفات الcss لي غادي نحتاجو وغادي تكون فيه القائمة لي غادي تمكنا من التنقل بين الصفحات الكود النهائي ديالو:

                                    <!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">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">
    <title>Game Shop</title>
    <!-- Bootstrap core CSS -->
    <link href="<?php echo base_url();?>assets/css/bootstrap.min.css" rel="stylesheet">
    <link href="<?php echo base_url();?>assets/css/custom.css" rel="stylesheet">
  </head>
  <body>
  <nav class="navbar navbar-default">
      <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
            <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="#">Game Shop</a>
        </div>
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav">
              <li><a href="<?php echo base_url()?>">Accueil</a></li>
          </ul>
          <?php if(!$this->session->userdata('logged') && empty($this->session->userdata('id'))):?>
          <ul class="nav navbar-nav">
              <li><a href="<?php echo base_url();?>users/register">Inscription</a></li>
          </ul>
          <form action="<?php echo base_url();?>users/login" method="post" class="navbar-form navbar-right">
              <div class="form-group">
                <input type="text" placeholder="Email" name="email" class="form-control" required="">
              </div>
              <div class="form-group">
                <input type="password" placeholder="Mot de passe" name="password"  class="form-control" required="">
              </div>
              <button type="submit" class="btn btn-success">Connexion</button>
          </form>
          <?php else:?>
             <ul class="nav navbar-nav">
                <li><a href="<?php echo base_url();?>users/logout">Déconnexion</a></li>
             </ul>
          <?php endif;?>
        </div><!-- /.navbar-collapse -->
      </div><!-- /.container-fluid -->
  </nav>
  

                                

5- الصفحات الأساسية تتمة

دائما فالمجلد includes غادي تزيد ملف تسميه footer.php لي غادي يكون أساس كل الصفحات وفيه روابط لملفات الjs لي غادي نحتاجو الكود النهائي ديالو:

                                                       </div>
              </div>
          </div>
      </div>
   </div>
</div> <!-- /container -->
  <footer class="row footer">
    <div class="container">
      <p>DarijaCoding ©2017</p>
    </div>
  </footer>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
</body>
</html>
                                


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

بحث في الموقع


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