تعلم كيف تبني موقع تجارة إليكتروني من الصفر..

JavaPorgrammer · 24 Apr 2011

بسم الله الرحمن الرحيم ..

الحمدلله والصلاة والسلام على رسوله الله وآله وصحبه ومن والاه أما بعد ..

أتيت بدرس هذا اليوم ، وسيكون ضمن سلسلة دروس إن شاء الله وإن كنت قد تأخرت فيه على بعض الإخوة .. -وأعتذ لهم عن ذلك-

وأرجو أن تعم الفائدة به ، وياحبذا الإخوة يعطونا اقتراحاتهم "مانستغني"..

كيف تنشأ موقع تجارة اليكتروني بسيط؟

دعونا نحدد احتياجات التشغيل والمراحل ..

نحتاج إلى :

1 - محرر الأكواد : netbeans .

تستطيع تحميله من خلال : http://www.netbeans.org

2- محرك قواعد البيانات : MySql .

تستطيع تحميله من خلال : http://dev.mysql.com/downloads/mysql/

3- سيرفر محلي وهو بالعادة يأتي مع الـ netbeans . سنتعامل في هذا الدرس مع glass fish

4- الأداة : MySql Workbench . "اختيارية"

تستطيع تحميلها من خلال : http://dev.mysql.com/downloads/workbench/5.2.html

5- الحزمة display-tag لاستخدامها في الجداول.

تستطيع تحميلها من خلال : http://www.displaytag.org/1.2/

6- قالب للموقع ، تستطيع تصميمه أنت وإن كنت على عجلة من أمرك "مثلي :lol: " فهناك قوالب مجانية متوفرة على الشبكة.

" سأرفقه لكم في حينه "

المراحل :

1- تصميم قاعدة البيانات .

2- بناء الكود.

دعونا نبدأ بالمرحلة الأولى :

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

سنحتاج إيضا إلى جدول للعملاء..

وجدول للفواتير ..

هذه تقريبا أهم الجداول التي نحتاجها حاليا :)

قم بتشغيل الـ MySql Workbench :

الواجهة الرئيسة

ننشئ Model جديد من خلال النقر على :

ستكون الواجهة بهذا الشكل:

نغير اسم قاعدة البيانات من خلال نقرتين مزدوجتين على الايقونة :

نكتب اسم القاعدة : commerce ..

بعد ذلك نبدأ بالرسم والمتعة :P .. من الأعلى :"Add diagram"

ستكون الواجهة الرئيسية بهذا الشكل ..

حسنا الآن .. سنضيف الجداول .. ستكون أربعة جداوال :

جدول الأصناف .
جدول المنتجات.
جدول العملاء.
جدول الفواتير.

إذا نضيف الجدول الأول : ولنسمه مثلا : ctg "يحب اختصار الاسماء :P "

عن طريق الأيقونة :

نروح للمكان الفاضي يمين وننقر نقرة واحدة .. راح ينشئ جدول جديد:

ننقر نقرتين مزدوجتين حتى نغير اسمه ونضيف حقول ..

نضيف اسماء الحقول ..

PK : اختصار primary key مفتاح رئيس
NN: اختصار Not Null لا يسمح باستقبال القيم الفارغة
UQ: اختصار unique قيمة وحيدة لا يسمح بالتكرار
BIN: اختصار Binary يقوم بتحويل القيم المدخلة إلى النظام الثنائي
UN: اختصار unsigned لا يسمح باستقبال القيم السالبة
AI : اختصار auto increment عداد تلقائي
ZF : لا أعلم :P

في الخانة الأخيرة : default هنا نضع القيم الافتراضية للحقل في حالة عدم إدخال بيانات إليه ..

ستكون حقول الجداول كالآتي :

الأصناف .. ctg


+-------------+------------------+------+-----+---------+----------------+
| Field       | Type             | Null | Key | Default | Extra          |
+-------------+------------------+------+-----+---------+----------------+
| ctg_id      | int(10) unsigned | NO   | PRI | NULL    | auto_increment |
| ctg_name    | varchar(45)      | NO   |     | NULL    |                |
| ctg_pic_url | varchar(45)      | NO   |     | NULL    |                |
+-------------+------------------+------+-----+---------+----------------+

المنتجات .. prod


+------------+------------------+------+-----+---------+----------------+
| Field      | Type             | Null | Key | Default | Extra          |
+------------+------------------+------+-----+---------+----------------+
| prod_id    | int(10) unsigned | NO   | PRI | NULL    | auto_increment |
| prod_name  | varchar(45)      | NO   |     | NULL    |                |
| prod_price | decimal(5,2)     | NO   |     | NULL    |                |
| prod_desc  | tinytext         | YES  |     | NULL    |                |

+------------+------------------+------+-----+---------+----------------+

جدول العملاء customer


+-------------+------------------+------+-----+---------+----------------+
| Field       | Type             | Null | Key | Default | Extra          |
+-------------+------------------+------+-----+---------+----------------+
| cus_id      | int(10) unsigned | NO   | PRI | NULL    | auto_increment |
| cus_name    | varchar(45)      | NO   |     | NULL    |                |
| cus_user    | varchar(60)      | NO   |     | NULL    |                |
| cus_pass    | mediumtext       | NO   |     | NULL    |                |
| cus_phone   | int(11)          | YES  |     | NULL    |                |
| cus_email   | varchar(45)      | NO   |     | NULL    |                |
| cus_address | varchar(45)      | YES  |     | NULL    |                |
+-------------+------------------+------+-----+---------+----------------+

جدول الطلبات cus_order


+-----------------+------------------+------+-----+-------------------+---------
-------+
| Field           | Type             | Null | Key | Default           | Extra
       |
+-----------------+------------------+------+-----+-------------------+---------
-------+
| ord_id          | int(10) unsigned | NO   | PRI | NULL              | auto_inc
rement |
| amount          | decimal(6,2)     | NO   |     | NULL              |
       |
| date            | timestamp        | NO   |     | CURRENT_TIMESTAMP |
       |
| num_config      | int(10) unsigned | NO   |     | NULL              |
       |
       |
+-----------------+------------------+------+-----+-------------------+---------
-------+

بعد ما ننشئ الجداول نأتي الآن إلى مرحلة الربط بينها ..

كل صنف يحوي اكثر من منتج .. إذا ستكون العلاقة واحد لمتعدد

كل عميل قد يكون له اكثر من فاتورة اذا ستكون العلاقة واحد لمتعدد

كل فاتورة قد تحوي عدة منتجات وكل منتج قد يكون موجود في عدة فواتير اذا العلاقة متعدد لمتعدد ..

كيف نمثل هذه العلاقة ؟

بالنسبة لعلاقة واحد لمتعدد "one- to- many" اولا نختار الايقونة :

بالاول نروح للمتعدد ثم للوحيد . . راح اوضح لك ..

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

نكرر العملية نفسها مع جدول [العميل = وحيد ] ، [الفاتورة = متعدد] ..

نأتي الآن إلى إنشاء العلاقة متعدد مع متعدد .. ستجد الايقونة التالية :

اضغط عليها واضغط على الجدولين ، الترتيب هنا غير مهم .. سينشئ علاقة جديدة .. الآن سيكون شكل الرسم كالآتي :

تمااام .. الآن قاعدة البيانات جاهزة للبناء :) سنصدرها إلى محرك قاعدة البيانات في الدرس القادم بإذن الله .. انتظرونا :wink:

تحياتي للجميع.

ToBeOrNotToBe · 24 Apr 2011

تسجيل إعجاب كبير بشغلك يابوحميد ... وانتظر عودتي مع مجموعة الأسئلة بعد تمحيص الموضوع بتمعن أكثر ..!!!

ابن رستم · 24 Apr 2011

ان شاء الله معك الى الاخر

شرح اكثر من رائع

Ahmed Abd El-Rasoul · 25 Apr 2011

شرح رائع يا ابو حميد ومنتظرين باقى الدرس

daziplqa · 26 Apr 2011

تم التثبيت ..

JavaPorgrammer · 26 Apr 2011

أشكر للإخوان تفاعلهم .. وشكرا على التثبيت ..

نأتي الآن إلى تصدير الـ Model إلى محرك قواعد البيانات..

من التبويب : Database -> تختار : forward Engineer

نحدد اول خيارين ..

نتابع ..

نكتب اسم المستخدم لقاعدة البيانات ..

كذا خلصنا :)

يمكنك التأكد من وجود قاعدة البيانات من خلال الـ console :


mysql> show databases;
+--------------------+
| Database           |
+--------------------+
| information_schema |
| commerce           |
| ebilling_db        |
| mysql              |
| test               |
+--------------------+
5 rows in set (0.34 sec)

ممتاز !

الآن ننتقل إلى المرحلة التمهيدية لبناء الأكود ، نفتح محرر الأكواد .. Netbeans

انتقل إلى التبويب Services ، ومن ثم databases نقرة باليمين New Connection

ثم نكتب البيانات المطلوبة..

راح تنضاف إلى قواعد البيانات الموجودة .. في الصورة التالية قاعدة البيانات وجداولها:

انتهينا الآن من المرحلة الأولى .. :)

بالنسبة لمن لا يريد استخدام الأداة السابقة :workbench: ، أرفقت لك ملف الاستعلام .

sqlFile.sql

وأيضا أرفقت لكم الـ Model الخاص بقاعدة البيانات

Model.rar

انتظرونا في المرحلة الثانية.

تقبلوا تحياتي.

ابن رستم · 26 Apr 2011

شكرا لك شرح اكثر من رائع

ارجو منك الاستمرار

almosamemnet · 26 Apr 2011

السلام عليكم ورحمة الله

الصحيح أخوي لا أقول إلا جزاك الله خير على ما قدمته من شرح مفيد جدا و الله يكثر من أمثالك

hanai · 27 Apr 2011

االدرس جكميل جدا والشرح طريقة الشرح مفيدة

براك الله فيك وجعلة في ميزان حسناتك

Ahmed Abd El-Rasoul · 28 Apr 2011

رائع كالعادة يا احمد :)

MOHAMED FATHY BASHA · 30 Apr 2011

مشكور يا احمد على هذا الدرس الرائع

وفى انتظار استكماله

بالتوفيق دائما

JavaPorgrammer · 30 Apr 2011

أشكر الجميع على تفاعلهم ..

وعذرا على التأخر

نكمل الآن ما انتهينا عنده :sleep:

ننشئ مشروعا جديدا من خلال الايقونة

ونختار java web ومن القائمة اليمنى web application :

سميته : "ArabTeamMarket" بس ياشباب تراي المدير العام من الحين :P

نختار السيرفر

وبعدها انهاء :happy:

راح يفتح لك صفحة الـ index جميل جدا .. لاختبار السيرفر قم بنشر المشروع عن طريق : زر باليمين على اسم المشروع -> Run ، راح يشغل لك الصفحة على المتصفح ..

حلو!

ننشئ مجلد الصفحات المحمية : protect ، من خلال زر باليمين على اسم المشروع -> new -> مجلد جديد "new folder"

نضيف إليه "مبدأيا" الصفحات :

cart -checkout - confirm

الآن نهيئ الاستايل والـ header , footer ..

ملف الاستايل المستخدم في هذا الدرس : cleantype.zip

سنحتاج منه ملف الـ css والصور الموجودة فيه :cool:

ننسخ ملف default.css إلى المجلد الرئيس ، وننسخ مجلد Images كذلك ..

ننشئ مجلد تحت مجلد WEB-INF ونسميه includes ، نضيف إليه صفحات JSP :

header + footer ، ولكن لاحظ الصورة التالية :

جعلنا الصفحات صفحات جزئية :)

نمسح محتويات صفحة الهيدر ، وننسخ إليه السطور التالية :


<%-- any content can be specified here e.g.: --%>
<%@ page pageEncoding="windows-1256" %>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
        <title>:: Arab Team Market ::</title>
    </head>
    <body>
      <div id="header">
		<div id="logo">
			<h1><a href="#">Super Market</a></h1>
			<h2><a href="http://www.freecsstemplates.org/">By Free CSS Templates</a></h2>
		</div>
		<!-- end div#logo -->
		<div id="menu">
			<ul>
				<li class="active"><a href="#">Home</a></li>
				<li><a href="#">categories</a></li>
				<li><a href="#">About</a></li>
				<li><a href="#">Contact</a></li>
                                <li><a href="#">My Cart</a></li>
			</ul>
		</div>
		<!-- end div#menu -->
	</div>

ونفس القضية في صفحة الفوتر :


<%-- any content can be specified here e.g.: --%>
<%@ page pageEncoding="windows-1256" %>
 <div id="footer">
		<p id="legal">Copyright © 2007 Clean Type. All Rights Reserved. Designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>.</p>
		<p id="links"><a href="#">Privacy Policy</a> | <a href="#">Terms of Use</a></p>
	</div>
    </body>
</html>

الآن نضيف ملف web.xml إلى المشروع من خلال :

نروح للتبويب Pages ثم Add JSP property Group..

نحدد له المسار الذي ستوضع فيه محتويات الهيدر والفوتر ..

وفي مشروعنا سيكون:


/index.jsp
/protect/*

بعد ذلك نحدد له صفحة الهيدر وصفحة الفوتر .. لاحظ الصورة الآتية:

قم بلصق محتويات الـ index في جميع الصفحات :


<%-- 
    Document   : index
    Created on : Apr 30, 2011, 1:46:07 PM
    Author     : Admin
--%>

<%@page contentType="text/html" pageEncoding="windows-1256"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
        <link href="default.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
      <div id="page">
		<div id="page-bgtop">
			<div id="content">
				<div class="post">
					<h2 class="title"><a href="#">Lorem Ipsum Dolor Volutpat</a></h2>
					<p class="byline">Posted by FreeCssTemplates</p>
					<div class="entry">
						<p><img src="images/img02.jpg" alt="" width="564" height="294" /></p>
						<p>This is <strong>Clean Type</strong>, a free, fully standards-compliant CSS template designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>, released for free under the <a href="http://creativecommons.org/licenses/by/2.5/">Creative Commons Attribution 2.5</a> license.  The photo used in this template is from <a href="http://www.pdphoto.org">PDPhoto.org</a>. You're free to use this template for anything as long as you link back to <a href="http://www.freecsstemplates.org/">my site</a>. Enjoy :)</p>
					</div>
					<div class="meta">
						<p class="links"><a href="#" class="comments">Comments (32)</a></p>
					</div>
				</div>
		  </div>
			<!-- end div#content -->
			<div id="sidebar">
				<ul>
					<li id="search">
						<h2>Search</h2>
						<form method="get" action="">
							<fieldset>
							<input type="text" id="seach-text" name="s" value="" />
							<input type="submit" id="search-submit" value="Search" />
							</fieldset>
						</form>
					</li>
					<li>
						<h2>Categories:</h2>
						<ul>
                                                    <li><a href="#">link 1</a></li>
                                                    <li><a href="#">link 2</a></li>
                                                    <li><a href="#">link 3</a></li>
						</ul>
					</li>
					<li>
						<h2>Other Options:</h2>
						<ul>
							<li><a href="#">Nec metus sed donec</a></li>
							<li><a href="#">Magna lacus bibendum mauris</a></li>
							<li><a href="#">Velit semper nisi molestie</a></li>
							<li><a href="#">Eget tempor eget nonummy</a></li>
							<li><a href="#">Nec metus sed donec</a></li>
							<li><a href="#">Magna lacus bibendum mauris</a></li>
							<li><a href="#">Velit semper nisi molestie</a></li>
						</ul>
					</li>
					<li></li>
				  <li></li>
			  </ul>
			</div>
			<!-- end div#sidebar -->
			<div style="clear: both; height: 1px"></div>
		</div>


        </div>
    </body>
</html>

قم بنشر المشروع ، يفترض أن تكون النتيجة :

نكمل الدرس القادم بإذن الله .

:)

ابن رستم · 30 Apr 2011

شكرا على كل المجهودا ت التي تبذلها حتى الآن كل شئ واضح

هل يوجد قوالب واجدة اخرى مثل هذه ومن اين نحصل عليها

JavaPorgrammer · 30 Apr 2011

حياك الله أخي ابن رستم ..

فيه مواقع كثيرة تقدم لك قوالب مجانية منها :

http://www.freecsstemplates.org/

اكتب فقط في قوقل : free css template

ستظهر لك قائمة طويلة من المواقع والله يعينك تبحث :)

تحياتي

Ahmed Abd El-Rasoul · 1 May 2011

يا سلام على الشغل يا ابو حميد ايه الحلاوه دى

بارك الله فيك يا ابو حميد :)

اسراء شلبى · 1 May 2011

الدرس جميل جدا جدا اخى الكريم :)

متابعة .....

elkaser · 6 May 2011

شرح اكثر من رائع بارك الله فيك اخي واصل عطائك

JavaPorgrammer · 10 May 2011

أشكركم على التفاعل .. وأعتذر بشدة عن التأخر لظروف خارجة عن قدرتي :blush:

حسنا نكمل ما انتهينا عنده :)

الآن سنقوم بإنشاء servlet يتحكم في الطلبات القادمة إلى السيرفر ويوجهها حسب الحدث المطلوب .. لاحظ الصورة الآتية:

سيكون نقطة التحكم في الطلبات ..

إذا على مجلد الـ source packages باليمين ثم جديد ثم servlet :

نسمي الـ package والفئة :

package : com.arabteam.Market

servlet : control

نجعل مساره الافتراضي وهو : /control

مع ملاحظة التأشير على Add information to deployment descriptor

إذا سيضيف بيانات الـ servlet للملف web.xml تلقائيا :


 <servlet>
        <servlet-name>control</servlet-name>
        <servlet-class>com.arabteam.Market.control</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>control</servlet-name>
        <url-pattern>/control</url-pattern>
    </servlet-mapping>

راح يفتح لك ملف الـ servlet ، قم بحذف دالة الـ doProcess وامسحها من الدالتين doGet و doPost ، ليكون بهذا الشكل :


package com.arabteam.Market;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 *
 * @author Admin
 */
public class control extends HttpServlet {

    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

    }

    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

    }
}

جميل جد!

الآن سنجعل الوارد إلى السيرفر عن طريق الدالة GET يتحول إلى POST من خلال استدعاء الدالة doPost في الدالة doGet ..

أضف هذا السطر إلى الدالة doGet :


 doPost(request, response);

الآن نقوم بالتحكم في توجيه الطلبات في دالة الـ doPost ... في كل رابط سنستخدم متغير ولنسمه مثلا action ، مثال حتى يتوضح المقال

خلال الوسم <a> :


<a href="/ArabTeamMarket/control?action=cart">link 1</a>

سنتعرف على الصفحة الهدف من هذا المتغير .. حسنا سنقوم باستدعاء هذا المتغير من خلال الدالة getParameter .. في الدالة doPost أضف الأسطر التالية "مبدأيا" :


String path = "/index.jsp";
       String act = request.getParameter("action");
       if(act != null){
      if(act.equalsIgnoreCase("home")){
           path = "/index.jsp";
       }
 if(act.equalsIgnoreCase("cart")){
           path = "/protect/cart.jsp";
       }       
    }
        try {
            request.getRequestDispatcher(path).forward(request, response);
        } catch (Exception ex) {
         ex.printStackTrace();
        }

في الكود أعلاه افترضنا ان الصفحة المراد فتحها هي الصفحة الرئيسة ، في حالة أن الـ action ليس فارغا فقم بالتعديل :

إن كان مساويا لـ home فانتقل إلى الصفحة الرئيسة

إن كان مساويا لـ cart فانقله إلى صفحة الـ cart

لاحظ أني أعطيته الرابط مابعد المجلد الرئيسي .. او مايسمى Context Path ..

سنقوم الآن بتعريف أحد المتغيرات العامة على مستوى التطبيق.. فبدلا عن كتابة هذا المسار :


/ArabTeamMarket/control

في كل مرة يقوم العميل بطلب البيانات من السيرفر ، سنقوم بكتابته مرة واحدة فقط في ملف web.xml ، أضف مايلي :


<context-param>
        <description>control servlet path</description>
        <param-name>base</param-name>
        <param-value>/ArabTeamMarket/control</param-value>
    </context-param>

كيف نستدعي هذه القيمة في الصفحة؟ :)


<% String control =(String) application.getInitParameter("base"); %>

حسنا سيتغير الرابط السابق إلى :


<li> <a href=<%= control %>?action=home>Home</a></li>

الآن نعدل على ملفات الهيدر والفوتر .. بإضافة ماذكرناه آنفا ..

سيصبح بعد التعديل :


<%-- any content can be specified here e.g.: --%>
<%@ page pageEncoding="windows-1256" %>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
        <title>:: Arab Team Market ::</title>
    </head>
    <body>
        <% String control =(String) application.getInitParameter("base"); %>
      <div id="header">
		<div id="logo">
			<h1><a href="#">Super Market</a></h1>
			<h2><a href="http://www.freecsstemplates.org/">By Free CSS Templates</a></h2>
		</div>
		<!-- end div#logo -->
		<div id="menu">
			<ul>
				<li class="active"><a href=<%= control %>>Home</a></li>
				<li><a href=<%= control %>?action=categories>categories</a></li>
				<li><a href=<%= control %>?action=about>About</a></li>
				<li><a href=<%= control %>?action=contact>Contact</a></li>
                                <li><a href=<%= control %>?action=cart>My Cart</a></li>
			</ul>
		</div>
		<!-- end div#menu -->
	</div>

نضيف في الـ servlet بقية الصفحات .. ليصبح بعد التعديل بهذا الشكل :


/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
package com.arabteam.Market;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 *
 * @author Admin
 */
public class control extends HttpServlet {

    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doPost(request, response);
    }

    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
     String path = "/index.jsp";
       String act = request.getParameter("action");
       if(act != null){
      if(act.equalsIgnoreCase("home")){
           path = "/index.jsp";
       }
      else if(act.equalsIgnoreCase("cart")){
           path = "/protect/cart.jsp";
       }       
      else if(act.equalsIgnoreCase("categories")){
          path = "/protect/category.jsp";
      }
      else if(act.equalsIgnoreCase("contact")){
          path = "/contact.jsp";
      }
      else if(act.equalsIgnoreCase("about")){
          path = "/about.jsp";
      }
    }

            request.getRequestDispatcher(path).forward(request, response);



}
}

كما لا ننسى إضافة الصفحات :

about.jsp و contact.jsp في المجلد العام

بنفس الطريقة السابقة نقوم بنسخ محتويات الـ index إليهما "مبدأيا" ونضيفهما إلى مجموعة الهيدر والفوتر .. راجع ردودي السابقة.

ستكون هيكلة الموقع كالآتي:

أي استفسار حياكم :)

انتظروني الدرس القادم ، وعسى أن يكون قريبا جدا. :wink:

تحياتي

~أميرة الورد~ · 11 May 2011

سلمت java porgrammer ]ابدعت فأجدت

واصل اخي ابداعك

لك ارق التحايا

ننتظر القاادم :)

almosamemnet · 11 May 2011

ما شاء الله تبارك الرحمن

مبدع

Ahmed Abd El-Rasoul · 12 May 2011

مبدع يا احمد :)

العيافـي · 1 Jun 2011

+3

يبدوا انه فاتني الكثير هنا ...

شكرا لك عزيزي JavaPorgrammer

ان شاء الله تعالى ساقوم بتنفيذ ما ورد في الشرح

وشكرا على الاداه MySql Workbench جديده على .

تم تعديل 1 Jun 2011 بواسطه العيافـي

JavaPorgrammer · 5 Jun 2011

شاكر للإخوة الاهتمام والمرور الكريم..

نكمل ماتوقفنا عنده ..

نعرف الآن مصدر البيانات للمشروع ..

نحدد المشروع ثم ملف جديد ، ونختار glassfish ومن القائمة اليمنى نختار JDBResource

نطلب منه انشاء connection pool جديد ونعطي الـ JNDI الاسم : jdbc/db

التالي التالي :)

نعطي الـ connectionPool اسم :) ونختار بعدها من القائمة قاعدة البيانات اللي هي بمشروعنا : commerce

بعد كذا نعطيه بيانات قاعدة البيانات : الرابط اسم المستخدم كلمة المرور :)

ثم بعدها finish والحمدلله :lol:

الآن نعرفها في ملف الـ web.xml .. نفتح الملف ، من التبويب References :

بعدها نعطيه اسم الـ resource :

راح يضيف لك السطور الآتية في ملف الـ web.xml :


 <resource-ref>
        <res-ref-name>jdbc/db</res-ref-name>
        <res-type>javax.sql.DataSource</res-type>
        <res-auth>Container</res-auth>
        <res-sharing-scope>Shareable</res-sharing-scope>
    </resource-ref>

جميل .. نختبر الآن.. إحنا ماشين صح والا لا :)

أنشئ صفحة جديدة ..

اختر من تبويب الـ database من الـ palette -> تقرير DB Report

نكتب الاستعلام وهو جلب كل محتويات جدول الأصناف :)

ستكون الصفحة كالآتي :


<body>
        <h1>Hello World!</h1><br/>
    <sql:query var="result" dataSource="jdbc/db">
        SELECT * FROM ctg
    </sql:query>

    <table border="1">
        <!-- column headers -->
        <tr>
        <c:forEach var="columnName" items="${result.columnNames}">
            <th><c:out value="${columnName}"/></th>
        </c:forEach>
    </tr>
    <!-- column data -->
    <c:forEach var="row" items="${result.rowsByIndex}">
        <tr>
        <c:forEach var="column" items="${row}">
            <td><c:out value="${column}"/></td>
        </c:forEach>
        </tr>
    </c:forEach>
</table>
    </body>

بعد حفظها وتشغيلها المفترض ستكون النتيجة :

Ahmed Abd El-Rasoul · 5 Jun 2011

الى الامام مبدع مبدع مبدع يا ابو حميد :)

bu-Tassneem · 12 Jun 2011

الأخ أحمد جزاكم الله كل خير على هذا المجهود الرائع

لكن لي سؤال أين تلك الملفات

نضيف إليه "مبدأيا" الصفحات :
cart -checkout - confirm

وكيف يتم إضافتها للمشروع

وجزاكم الله كل خير على هذا المجهود الرائع

JavaPorgrammer · 12 Jun 2011

http://www.arabteam2000-forum.com/index.php?app=core&module=attach&section=attach&attach_rel_module=post&attach_id=116963
نضيف إليه "مبدأيا" الصفحات :
cart -checkout - confirm

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

يعني من اسم المشروع بالزر الأيمن -> تختار new -> تختار JSP

تم تعديل 12 Jun 2011 بواسطه JavaPorgrammer

تعلم كيف تبني موقع تجارة إليكتروني من الصفر..

سؤال

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

53 إجابة على هذا السؤال .

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة

شارك الرد من خلال المواقع ادناه

شارك هذا الرد

رابط المشاركة