Final Web Programming

I HC QUC GIA THNH PH H CH MINH

TRNG I HC BCH KHOA

BO CO BI TP LNLP TRNH WEB

DANH B WEBSITE

Sinh vin thc hin:

Nguyn Hong c 51100867

Trn Nguyn Thin Huy 51101388

05/2014

Gio vin hng dn:Nguyn Hu Hiu

BO CO ASSIGNMENT LP TRNH WEB TI 5: WEBSITE DIRECTORY

2

MC LC

I. GII THIU...............................................................................................................................................................4

II. CU TRC M NGUN:..........................................................................................................................................5

1. Th mc chnh:...............................................................................................................................................5

2. Folder Category:.............................................................................................................................................5

3. Folder Css:...................................................................................................................................................... 5

4. Folder Function:............................................................................................................................................. 5

5. Folder Images:................................................................................................................................................ 5

6. Folder Js:.........................................................................................................................................................5

III. CU TRC WEBSITE...............................................................................................................................................6

1. Header:...........................................................................................................................................................6

2. Main 1:............................................................................................................................................................6

3. Main 2:............................................................................................................................................................7

4. Main 3:............................................................................................................................................................8

5. Footer:............................................................................................................................................................ 8

IV. C S D LIU:.....................................................................................................................................................9

1. Website_info:................................................................................................................................................. 9

2. Tag_mean:......................................................................................................................................................9

3. Tag_info:.......................................................................................................................................................10

4. User_db:....................................................................................................................................................... 10

V. CHC NNG:........................................................................................................................................................11

1. Register:........................................................................................................................................................11

2. Login:............................................................................................................................................................ 13

3. Logout:..........................................................................................................................................................13

4. Forgot password:..........................................................................................................................................13

5. View-profile:.................................................................................................................................................14

6. Admin panel:................................................................................................................................................ 14

7. Popular websites:.........................................................................................................................................15

8. My favorite websites:...................................................................................................................................15


3

9. Module Thi tit - Gi vng - T gi:............................................................................................................ 15

10. Module Bo mi:........................................................................................................................................15

11. Module Facebook:......................................................................................................................................16

12. Button Top Arrow:......................................................................................................................................16

13. Tm kim:....................................................................................................................................................16

14. View all:...................................................................................................................................................... 17

VI. PHN CNG CNG VIC:.................................................................................................................................... 18

VII. KT QU:............................................................................................................................................................ 18

1. u im:.......................................................................................................................................................18

2. Nhc im:.................................................................................................................................................18

3. Kh khn:......................................................................................................................................................18

VIII. DEMO:............................................................................................................................................................... 19

IX. TI LIU THAM KHO:.........................................................................................................................................20


4

I. GII THIU

Trong thi i cng ngh thng tin pht trin nh hin nay, vic truy cp cc website tra cu thng tin,hc tp, gii tr... l nhu cu rt cn thit ca mi ngi.Website Directories ra i gii quyt vn . y l mt trang web tng hp a ch v thng tin canhiu website ni ting, c phn chia theo tng danh mc c th.iu ny s gip ngi dng:- Duyt web nhanh chng vi thao tc click n gin. Khng cn phi nh hay g tn min ca tngwebsite.- Trang web ca gii thiu nhng website uy tn, cht lng c chn lc nn rt an ton.- D dng tra cu nhng tin ch hng ngy nh t gi, thi tit, tin tc... mt cch nhanh chng.


5

II. CU TRC M NGUN:

1. Th mc chnh:Cha cc th mc con bn di v cc file:

- index.php: Trang ch- register.php: ng k thnh vin- logout.php: ng nhp- logout.php: ng xut- forgotpass:php: Ly li password mi khi qun- search.php: Tm kim website- view-profile.php: Xem thng tin c nhn ca thnh vin- admin.php: Trang qun tr ca admin

2. Folder Category:Cha cc file .php ca tng danh mc website. Khi truy cp vo cc file ny, trnh duyt s hin th

tt c cc website thuc danh mc tng ng.

3. Folder Css:Cha cc file css lin quan nh dng website

4. Folder Function:Cha cc hm php cn thit nh tng lng visit; thm-sa-xa trang web, thnh vin...

5. Folder Images:Cha cc folder nh ca icon website, background, cc button login, search...

6. Folder Js:Cha cc file javascripts lm menu slide cho Top 5 sites, cun trang, cp nht lt visit...


6

III. CU TRC WEBSITE

1. Header:

Demo:

Gm ba phn: Website logo (#logo), khung tm kim (#search1), khung ng nhp (#loginContainer).- Website logo: nh i din ca Website- Khung tm kim: Cho php ngi dng thc hin chc nng tm kimWebsite- Login: Ngi dng ng nhp c th thc hin nhng chc nng cao hn.Giao din khi click vo nt login:

2. Main 1:

Demo:

Gm 2 phn chnh: Menu (#cssmenu) v Top 5 sites (#featured)- Menu: Hin th cc danh mc website, khi ngi dng click vo tn tng danh mc, website s t ng

chuyn n v tr thch hp- Top 5 sites: Hin th 5 website c xp hng cao nht do trang Alexa bnh chn.


7

3. Main 2:

Demo:

Gm 3 phn c bn:- Popular sites (#popularsite): Hin th websites c lng visit cao nht, sp xp theo th t visit gim dn.- Favorite sites (#favsite): Ch hin th khi ngi dng ng nhp. Ban u cc website s c chn theo

lt visit cao nht, sau ngi dng c th ty chnh websites a thch bng button c hnh du [+]- Cc tabs:+ C 8 tabs chnh, mi tab tng ng vi mt danh mc trn menu. Khi ngi dng click vo danh mc trn

menu, trnh duyt s dn ngi dng n a ch tng ng.+ ng vi mi tab chnh s c mt vi tabs ph c chung ch hoc lin quan. Ngi dng click tng tabs

ph hin th danh mc cc website tng ng.


8

4. Main 3:

Demo:

Gm 2 phn c bn:- Khung thi tit - t gi (#RSS): Hin th thi tit ca tng a phng, gi vng, t gi hi oi ca cc n

v tin t trn th gii.- Khung Bo mi (#baomoi): Mt widget ca Baomoi.com dng hin th cc tin tc mi nht trong ngy

5. Footer:

Demo:

Cha thng tin ca ngi lp trnh websites

9

IV. C S D LIU:

1. Website_info:

C s d liu ny dng cha tt c thng tin v Website, gm c: ID, Name, Description, VisitTrong :

ID: Con s duy nht ng vi mi websiteName: Tn c websiteDescription: M t tng quan v websiteVisit: S lt khch gh thm website. Visit s t ng tng khi ngi dng click vo website.

Demo:

2. Tag_mean:

Tag: danh mc tng website. V d: Tin tc, th thao, gio dc...C s d liu ny nh ngha tn tag vi ID tng ng, gm c: ID, NameDemo:


10

3. Tag_info:

C s d liu ny cha d liu website ca tng tag, ta s bit c website no thuc nhng tag no hoctag no cha website g. Mt tag c th cha nhiu website, v mt site c th trong nhiu tag.Demo:

4. User_db:

C s d liu ny cha thng tin ca cc thnh vin ng k, gm ID, User ID, Pass, Hovaten, Email, Sex,Birthday, Phone_number.Demo:


11

V. CHC NNG:

1. Register:

- Ngi dng click LOGIN trn thnh Header, mt pop-up s hin th nh hnh di:

- Click vo ch Register n trang ng k (/register.php)

- Nhp y thng tin v click nt ng k. Nu khng ng nh dng email:


12

- Nu tn ti khon qu ngn, s c thng bo: The length must between 2 to 20

- Nu trng email/tn ti khon hoc sai xc nhn mt khu s c thng bo: ng k khng hp l.


13

2. Login:

- Nhp thng tin vo form login v nhn nt LOGIN:

- Nu ng nhp thnh cng, trn thanh Header nt login s bin mt v thay bng:

- Nu ng nhp tht bi s hin thng bo sai mt khu hoc pass v yu cu ng nhp li.

3. Logout:

Ngi dng click nt LOGOUT ng xut.

4. Forgot password:

Ngi dng click nt Forgot password cp nht li mt khu mi.


14

5. View-profile:

Ngi dng click vo tn ca mnh dng HELLO, Username ^^ vo trang chnh sa thng tin c nhn.

6. Admin panel:

Khi admin ng nhp, website s t ng chuyn n trang /admin.php qun l ngi dng v website:

* Chc nng ADDWEBSITE:

Ln lt nhp tn Website, a ch, tag, miu t v nhn submit add 1 site vo c s d liu

* Chc nng DELETE WEBSITE:

Nhp tn hoc a ch v n submit xa 1 site khi c s d liu

* Chc nng DELETE USER:


15

Nhp username v n delete xa 1 user khi c s d liu

7. Popular websites:

Thanh ny dng hin th danh sch cc website c lt truy cp cao nht.

Lt truy cp ca 1 site c t ng tng ln khi ngi dng hoc khc click vo site .

8. My favorite websites:

Ngi dng click vo nt [+] ty chnh website yu thch.

9.Module Thi tit - Gi vng - T gi:

Hin th thi tit ca tng a phng bng cch click nt mi tn en hin ra list cc a phng.

Gi vng v t gi c cp nht hng ngy.

y l widget ly t trang vnexpress.net.

10.Module Bo mi:


16

Hin th cc tin mi nht trong ngy. Ngi dng click vo tiu ca bi vit, 1 tab trnh duyt mi s m ra vdn n link bi vit. Cng c ny gip ngi dng cp nht tin tc nhanh chng v hiu qu (cc tin hin th lcc tin mi v nng hi nht)

Module ny cung cp bi baomoi.com.

11.Module Facebook:

Khi click vo button facebook bn tay phi, mt module s hin ra nh hnh trn.

Ngi dng c th like Fanpage caWebsite Directories cp nht nhng tin tc mi nht v giao lu kt bnvi bn b trn ton th gii.

12. Button Top Arrow:

Mt button nh hnh mi tn mu xanh gc phi mn hnh cho php chng ta tr ln u trang mt cch tinli nht.

13. Tm kim:

Nhp tn website cn tm trn thanh tm kim Header:


17

Kt qu s tr v cc website c tn hoc m t tng ng:

14. View all:

Mi danh mc website u c mt button View all. Ngi dng click vo hin th tt c cc website thucdanh mc . Trnh duyt s load n trang tng ng. V d vi View all ca NEWS (dn n trang /news.php):


18

VI. PHN CNG CNG VIC:

Nguyn Hong c: ph trch cc phn PHP, Javascripts, Ajax, Database

Trn Nguyn Thin Huy: ph trch cc phn HTML, CSS, Database, Bo co, Up web ln host

VII. KT QU:

1. u im:

- Lp c mt website directories vi cc chc nng c bn

- Website chy n nh, giao din kh thn thin

- p ng c yu cu quan trng ca bi: Dng cc kin thc c hc: HTML/CSS, Javascript, PHP vMySQL, s dng Ajax.

2. Nhc im:

- Cha c mt s chc nng quan trng nh chnh sa thng tin c nhn, i password

- Cha trnh c cc li bo mt cn bn

3. Kh khn:

- D liu website kh ln, mt nhiu thi gian cho vic to c s d liu

- Cc kin thc mi hc nn cha s dng thnh tho

- Nhm ch c 2 thnh vin nhng khi lng cng vic kh ln v khong thi gian ny cc mn hc khc cngn giai on deadline Assignment nn khng hon thnh tt


19

VIII. DEMO:

http://www.websitedirectories.tk/

Hoc

http://shinichikudo_121.byethost7.com/

http://www.websitedirectories.tk/http://shinichikudo_121.byethost7.com/


20

IX. TI LIU THAM KHO:

[1] Slide bi ging ca www.webstepbook.com

[2] Cc video v PHP, MY SQL ca IZWEB

[3] Website W3School

Documents

Final Web Programming