BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG CAO ĐẲNG KINH TẾ - CƠNG NGHỆ TP. HỒ CHÍ MINH

ĐỀ TÀI ĐỒ ÁN TỐT NGHIỆP:

THIẾT KẾ VÀ XÂY DỰNG TRANG THÔNG
TIN ĐIỆN TỬ CHO CÔNG TY ĐỨC DUY

Giảng viên hướng dẫn:
Sinh viên thực hiện:
Mã số Sinh viên:
Lớp:
Ngành: Công Nghệ Thông Tin
Chuyên ngành: Công Nghệ Phần Mềm

TP. Hồ Chí Minh, tháng 05 năm 20


Mục Lục

TRƯỜNG CAO ĐẲNG KT-CN TP.HCM
KHOA KỸ THUẬT-CƠNG NGHỆ
------------------------

CỘNG HỊA XÃ HỘI CHỦ NGHĨA VIỆT NAM
ĐỘC LẬP – TỰ DO – HẠNH PHÚC
-----------------------------------------------

NHẬN XÉT ĐÁNH GIÁ CỦA GIẢNG VIÊN HƯỚNG DẪN
ĐỀ TÀI: Thiết kế và xây dựng trang thông tin điện tử cho công ty đức duy
Sinh viên:

MSSV:

Lớp:

Chuyên ngành: Công Nghệ Phần Mềm
Nhận xét của giáo viên hướng dẫn:
................................................................................................................................
................................................................................................................................
................................................................................................................................
................................................................................................................................
................................................................................................................................
................................................................................................................................
................................................................................................................................
................................................................................................................................
Điểm: (Bằng chữ và bằng số):
TP.HCM, ngày

tháng

Giáo viên
(Ký và ghi rõ họ tên)

năm 20


TRƯỜNG CAO ĐẲNG KT-CN TP.HCM
KHOA KỸ THUẬT-CƠNG NGHỆ
------------------------


CỘNG HỊA XÃ HỘI CHỦ NGHĨA VIỆT NAM
ĐỘC LẬP – TỰ DO – HẠNH PHÚC
-----------------------------------------------

NHẬN XÉT ĐÁNH GIÁ CỦA GIẢNG VIÊN PHẢN BIỆN
ĐỀ TÀI: Thiết kế và xây dựng trang thông tin điện tử cho công ty đức duy
Sinh viên:

MSSV:

Lớp:

Chuyên ngành: Công Nghệ Phần Mềm
Nhận xét của giáo viên phản biện:
................................................................................................................................
................................................................................................................................
................................................................................................................................
................................................................................................................................
................................................................................................................................
................................................................................................................................
................................................................................................................................
................................................................................................................................
Điểm: (Bằng chữ và bằng số):
TP.HCM, ngày

tháng

năm 2019

Giáo viên

(Ký và ghi rõ họ tên)


LỜI CẢM ƠN
Em xin chân thành cảm ơn sự giúp đỡ nhiệt tình của thầy giáo, người đã cung cấp
cho em những kiến thức cơ bản về đồ án thực tập tốt nghiệp, cũng như định hướng cho
em những phướng pháp lập trình và cung cấp tài liệu kham khảo, để em có thể hồn
thành tốt mơn học này.
Trong q trình học tập, cũng như là trong quá trình làm bài báo cáo, khó tránh
khỏi sai sót, rất mong các thầy, cơ bỏ qua. Đồng thời do trình độ lý luận cũng như kinh
nghiệm thực tiễn còn hạn chế nên bài báo cáo khơng thể tránh khỏi những thiếu sót, em
rất mong nhận được ý kiến đóng góp thầy để em học thêm được nhiều kinh nghiệm và
sẽ hoàn thành tốt hơn bài báo cáo tốt nghiệp sắp tới.
Em xin chân thành cảm ơn!

4


LỜI MỞ ĐẦU

Ngày nay khoa học kỹ thuật trên thế giới nói chung, ở Việt Nam nói riêng đang
trên đà phát triển mạnh mẽ và không ngừng nâng cao phát triển về mọi mặt. Đặc biệt là
ngành công nghệ thông tin. Để đáp ứng nhu cầu ngày càng cao của con người thì hàng
loạt các cơng ty về máy tính được ra đời và các ứng dụng công nghệ thông tin đang
được áp dụng ngày một nhiều hơn.
Trong suốt thời gian dài phát triển của mình Visual Studio đã, đang thể hiện được
sức mạnh, sự quyến rũ của mình trong nền cơng nghiệp thiết kế phần mềm, tin học hố.
Khơng có quá nhiều phần mềm vừa có thời gian thử nghiệm phát triển dài, lại vừa có
sức phổ biến mạnh mẽ như Visual Studio.
Đồ án này được thiết kế theo những công cụ hỗ trợ mà Visual Studio mang lại,

Google Sites xuất hiện lần đầu vào tháng 2 năm 2008. Chính vì vậy mà nó giải quyết
được những vướng mắt gặp phải khi thiết kế phần mềm theo phương pháp truyền
thống.

5


CHƯƠNG 1
TỔNG QUAN VỀ VISUAL STUDIO, C# VÀ SQL
1.1 Tìm hiểu về visual studio.
1.1.1 Visual studio là gì?
Microsoft Visual Studio là một mơi trường phát triển tích hợp (IDE) từ Microsoft.
Nó được sử dụng để phát triển chương trình máy tính cho Microsoft Windows, cũng
như các trang web, các ứng dụng web và các dịch vụ web. Visual Studio sử dụng nền
tảng phát triển phần mềm của Microsoft như Windows API, Windows Forms, Windows
Presentation Foundation, Windows Store và Microsoft Silverlight. Nó có thể sản xuất
cả hai ngơn ngữ máy và mã số quản lý.
Visual studio là một trong những công cụ hỗ trợ lập trình rất nổi tiếng nhất hiện
nay của Mcrosoft và chưa có một phần mềm nào có thể thay thế được nó. Visual Studio
được viết bằng 2 ngơn ngữ đó chính là C# và VB+. Đây là 2 ngơn ngữ lập trình giúp
người dùng có thể lập trình được hệ thống một các dễ dàng và nhanh chóng nhất thơng
qua Visual Studio.
Visual Studio là một phần mềm lập trình hệ thống được sản xuất trực tiếp
từ Microsoft. Từ khi ra đời đến nay, Visual Studio đã có rất nhiều các phiên bản sử
dụng khác nhau. Điều đó, giúp cho người dùng có thể lựa chọn được phiên bản tương
thích với dịng máy của mình cũng như cấu hình sử dụng phù hợp nhất.
Ngồi chức năng cơ bản là viết mã, build và debug, visual studio còn cung cấp
cho người dùng những chức năng như:
Làm việc nhóm thơng qua Team Foundation Server của Microsoft.
Advanced Breakpoints.

Các phím tắt và plugins hỗ trợ người dùng thao tác nhanh trong việc viết mã.
Wizard Classes.
Tùy chỉnh liên kết các project và thư viện, tập tin liên quan.

6


Bên cạnh đó, Visual Studio cịn cho phép người dùng có thể tự chọn lựa giao diện
chính cho máy của mình tùy thuộc vào nhu cầu sử dụng.
Giao diện của visual studio

Visual studio 2013 có 3 bộ theme chính phục vụ người dùng là Dark, Blue và
Light. Điểm khác biệt của 3 bộ theme này chỉ là màu sắc của giao diện làm việc, các
hình ảnh sử dụng trong bài viết thuộc về bộ theme Dark.
Để thay đổi màu sắc, người dùng chỉ cần vào Tools -> Option.
Vị trí Option

7


Tại cửa sổ vừa hiện lên, tại mục General chọn Color theme cần đổi và bấm ok

8


Giao diện của Option

1.1.2 Giao diện làm việc chính của Visual Studio
Để bắt đầu làm việc với visual studio, người dùng cần phải tạo hoặc mở ra một
Solution và tạo hoặc mở một hoặc nhiều Project trong đó.

Giao diện làm việc chính của Visual Studio

Solution Explorer: là cửa sổ hiển thị Solution, các Project và các tập tin trong Project.

9


Khu vực code: đây là khu vực để lập trình viên viết mã nguồn cho chương trình. Cửa
sổ lập trình cho một tập tin trong Project sẽ hiển thị khi người dùng nháy chuột lên tập
tin đó trong cửa sổ Solution Explorer.
Output: đây là cửa sổ hiển thị các thông tin, trạng thái của Solution khi build hoặc
của chương trình khi debug.
Error List: là cửa sổ hiển thị danh sách lỗi (Error) hoặc cảnh báo (Warning) của
chương trình khi build.
Toolbar với các công cụ hỗ trợ người dùng trong việc viết mã và debug (các cơng
cụ trên thanh có thể thay đổi khi bắt đầu debug).
Thanh menu với đầy đủ các danh mục chứa các chức năng của visual studio. Khi
người dùng cài thêm những trình cắm hỗ trợ visual studio (ví dụ như Visual Assist),
thanh menu này sẽ cập nhật thêm menu của các trình cắm (nếu có).
Một lưu ý thêm là các cửa sổ trong giao diện làm việc của visual studio không
được gắn cố định, nên người dùng có thể tự do tùy chỉnh khung làm việc của mình sao
cho phù hợp nhất. Độc giả có thể thử click vào thanh tiêu đề của một cửa sổ hoặc một
thẻ tập tin code và kéo ra khỏi vị trí của nó, một số biểu tượng hỗ trợ sẽ xuất hiện trên
giao diện visual studio để người dùng “thả” cửa sổ vừa kéo ra vào đó hoặc thả trơi nổi
như một popup trên giao diện visual studio.
1.1.3 Thêm cửa sổ vào giao diện Visual Studio
Đôi khi giao diện của visual studio trở nên quá dày đặc do quá nhiều cửa sổ, lúc
này giải pháp được visual studio đưa ra là “gộp” nhiều cửa sổ lại với nhau và quản lý
dưới dạng “thẻ”. Nội dung của cửa sổ sẽ được hiển thị khi ta click vào thẻ tương ứng
Một số chức năng khơng được kích hoạt sẵn trên giao diện cơ bản của visual studio,

hoặc cũng có thể do người dùng vơ tình tắt mất.
10


Để hiển thị cửa sổ mong muốn , người dùng có thể vào View và chọn cửa sổ cần
hiển thị.
Một cửa sổ được đặt trong View -> Other Windows, các thanh công cụ được đặt trong
View -> Toolbars.

Thêm cửa sổ vào Visual Studio

1.1.4 Build, Debug và Run
Ở các phiên bản từ visual studio 2012 trở về trước, phím tắt mặc định để Build
một Solution là F7, tuy nhiên ở phiên bản visual studio 2013, thao tác này được chuyển
đến tổ hợp phím Ctrl + Shift + B.
Để bắt đầu Debug một Solution, ta sử dụng phím tắt F5.
Để Run một Solution, ta sử dụng tổ hợp phím Ctrl + F5.
Khác biệt giữa Debug và Run: Khi ta Run 1 Solution, tức là ta chạy trực tiếp
chương trình sinh ra từ Solution đó trên Windows, những Breakpoint ta đặt trên cửa sổ
code của visual studio sẽ không được bắt, và cửa sổ Output cũng sẽ không cập nhật
trạng thái của chương trình đang chạy, nói cách khác là ta đang “chạy thật” chương
trình đó trên máy. Với những ví dụ nêu trên (mã nguồn từ ảnh), chúng ta có thể thấy sự
11


khác biệt trực quan hơn: khi ta Run, chương trình sẽ dừng lại cho ta xem kết quả, kèm
theo một dòng ký tự “Press any key to continue…!” còn Debug thì khơng.
1.2 Tìm hiểu về C#
1.2.1 Sơ lược về C#
C# (đọc là “C thăng” hay “C sharp” (“xi-sáp”)) là một ngơn ngữ lập trình thuần

hướng đối tượng được phát triển bởi Microsoft.
C# ra đời năm 2000, được thiết kế chủ yếu bởi Anders Hejlsberg – kiến trúc sư
phần mềm nổi tiếng với các sản phẩm Turbo Pascal, Delphi, . . .
Được xây dựng dựa trên nền tảng của 2 ngôn ngữ lập trình mạnh nhất đó là C+
+ và Java. Do đó C# được miêu tả là ngơn ngữ có sự cân bằng giữa C++, Visual Basic,
Delphi và Java.
C# với sự hỗ trợ mạnh mẽ của .NET Framework giúp cho việc tạo một ứng
dụng Windows Forms hay WPF (Windows Presentation Foundation), . . . trở nên rất dễ
dàng.
Ngôn ngữ lập trình C# có những đặc trưng cơ bản sau:
•

Là một ngơn ngữ thuần hướng đối tượng

•

Là ngơn ngữ khá đơn giản, chỉ có khoảng 80 từ khóa và hơn mười mấy kiểu dữ
liệu được dựng sẵn.

•

Cung cấp những đặc tính hướng thành phần (component-oriented) như là
Property, Event.C# khơng khuyến khích sử dụng con trỏ như trong C++

•

nhưng nếu thực sự muốn sử dụng thì phải đánh dấu đây là mã khơng an tồn
(unsafe).

•


C# có bộ Garbage Collector sẽ tự động thu gom vùng nhớ khi khơng cịn sử dụng
nữa.

•

C# đã loại bỏ đa kế thừa trong C++ mà thay vào đó C# sẽ hỗ trợ thực thi giao diện
interface.

1.2.2 Một số ưu điểm nổi bật của C#
Gần gũi với các ngơn ngữ lập trình thơng dụng (C++, Java, Pascal).
12


Xây dựng dựa trên nền tảng của các ngôn ngữ lập trình mạnh nên thừa hưởng
những ưu điểm của những ngơn ngữ đó.
Cải tiến các khuyết điểm của C/C++ như con trỏ, các hiệu ứng phụ, . . .
Dễ tiếp cận, dễ phát triển.
Được sự hỗ trợ của .NET Framework.
Đi kèm với những điểm mạnh trên thì C# cũng có những nhược điểm
Nhược điểm lớn nhất của C# là chỉ chạy trên nền Windows và có cài .NET
Framework.
Thao tác đối với phần cứng yếu hơn so với ngôn ngữ khác. Hầu hết phải dựa vào
windows.
1.2.3 Tại sao lại lựa chọn ngôn ngữ C#?
C# là một ngôn ngữ đơn giản.
C# là một ngôn ngữ hiện đại.
C# là một ngôn ngữ mạnh mẽ và mềm dẻo.
C# là một ngơn ngữ ít từ khóa.
C# là một ngơn ngữ phổ biến.

C# mang sức mạnh của nhiều ngôn ngữ (C++, Java, . . .)
Mỗi ngôn ngữ sẽ có một thế mạnh phát triển riêng. Nhưng C# đang chứng
minh cho thế giới thấy nó có khả năng thay thế một số ngôn ngữ khác và trở mạnh
ngơn ngữ đa năng.
1.3 Tìm hiểu về SQL Server 2008
1.3.1 SQL là gì?
SQL là viết tắt của Structured Query Language, là ngơn ngữ truy vấn mang tính
cấu trúc.
Nó được thiết kế để quản lý dữ liệu trong một hệ thống quản lý cơ sở dữ liệu quan
hệ (RDBMS).
SQL là ngôn ngữ cơ sở dữ liệu, được sử dụng để tạo, xóa trong cơ sở dữ liệu, lấy
các hàng và sửa đổi các hàng, …
13


Tất cả DBMS như MySQL, Oracle, MS Access, Sybase, Informix, Postgres và
SQL Server sử dụng SQL như là ngôn ngữ cơ sở dữ liệu chuẩn.
Tại sao SQL là cần thiết
SQL là cần thiết để:
Tạo cơ sở dữ liệu, bảng và view mới.
Để chèn các bản ghi vào trong một cơ sở dữ liệu.
Để xóa các bản ghi từ một cơ sở dữ liệu.
Để lấy dữ liệu từ một cơ sở dữ liệu.
Chức năng của SQL
Với SQL, chúng ta có thể truy vấn Database theo nhiều cách khác nhau, bởi sử
dụng các lệnh.
Với SQL, người dùng có thể truy cập dữ liệu từ RDBMS.
SQL cho phép người dùng miêu tả dữ liệu.
SQL cho phép người dùng định nghĩa dữ liệu trong một Database và thao tác nó
khi cần thiết.

Cho phép người dùng tạo, xóa Database và bảng.
Cho phép người dùng tạo view, Procedure, hàm trong một Database.
Cho phép người dùng thiết lập quyền truy cập vào bảng, thủ tục và view.
Lịch sử của SQL
1970 -- Dr. Edgar F. "Ted" Codd của IBM được biết đến như là cha đẻ của Relational
Database (Cơ sở dữ liệu quan hệ). Ông miêu tả một mơ hình quan hệ (Relational
Model) cho các Database.
1974 -- SQL (Structured Query Language) xuất hiện.
1978 -- IBM tiếp tục phát triển ý tưởng của Codd và công bố một sản phẩm tên là
System/R.
1986 -- IBM phát triển nguyên mẫu đầu tiên về Relation Database và được chuẩn hóa
bởi ANSI. Relation Database đầu tiên được công bố là Relational Software và sau đó là
Oracle.
Lệnh trong SQL
14


Các lệnh SQL chuẩn để tương tác với Relational Database là CREATE, SELECT,
INSERT, UPDATE, DELETE và DROP. Các lệnh này có thể được phân loại thành các
nhóm dựa trên bản chất của chúng.
DDL (Data Definition Language) – Ngôn ngữ định nghĩa dữ liệu
Lệnh CREATE: Tạo một bảng, một View của bảng, hoặc đối tượng khác trong
Database.
Lệnh ALTER: Sửa đổi một đối tượng Database đang tồn tại, ví dụ như một bảng.
Lệnh: Xóa tồn bộ một bảng, một View của bảng hoặc đối tượng khác trong một
Database.
DML (Data Manipulation Language) – Ngôn ngữ thao tác dữ liệu
Lệnh SELECT: Lấy các bản ghi cụ thể từ một hoặc nhiều bảng.
Lệnh INSERT: Tạo một bản ghi.
Lệnh UPDATE: Sửa đổi các bản ghi.

Lệnh DELETE: Xóa các bản ghi.
DCL (Data Control Language) – Ngơn ngữ điều khiển dữ liệu
Lệnh GRANT: Trao một quyền tới người dùng.
Lệnh REVOKE: Thu hồi quyền đã trao cho người dùng.
1.3.2 SQL dùng để làm gì?
SQL có khả năng đáp ứng hầu hết các yêu cầu đối với việc phân tích, cập nhật dữ
liệu từ các bảng
Trong bảng dữ liệu chọn lọc một số cột nhất định: Có thể dùng SQL để tách ra chỉ
những cột cần thiết mà thôi, thường ta không sử dụng tất cả các thông tin của bảng
cùng một lúc.
Lọc các bản ghi theo những tiêu chuẩn khác nhau: như in danh sách nhân viên chỉ
của một vài phịng ban hoặc tách riêng các hố đơn của một khách hàng nào đó...
Theo những tiêu chuẩn khác nhau sắp xếp các bản ghi: Để tiện cho việc theo dõi
các báo cáo thường có yêu cầu theo những cột khác nhau hãy sắp sếp các bản ghi. Có
15


báo cáo sắp xếp theo mặt hàng được bán, có báo cáo thống kê sắp xếp theo khách hàng
mặc dù tất cả thông tin nằm trong cùng một bảng bán hàng. Bằng SQL ta có thể thực
hiện sắp xếp theo nhiều cột hoặc một cột khác nhau.
Kết hợp hai hay nhiều bảng theo chiều ngang: Trong cơ sở dữ liệu, các bảng liên
hệ với nhau qua các trường khoá và mỗi bảng lưu trữ thông tin về một đối tượng.
Nối hai hay nhiều bảng theo chiều dọc: ta có thể phải quản lý nhiều bảng theo cùng
một mẫu khi dữ liệu rất lớn hoặc phân tán ở nhiều nơi như mỗi bảng cho một quý,
tháng hoặc một công ty. Ta có thể dùng SQL để nối các bảng lại với nhau khi cần tổng
hợp dữ liệu của cả tổng công ty hay chỉ của cả một năm.
1.3.3 Tại sao nên chọn SQL?
SQL ngày càng đóng vai trị quan trọng khi mà hiện nay Internet ngày càng phát
triển. SQL thường được sử dụng để tạo ra các trang web động và các trang web này
thường có nội dung được lấy ra từ cơ sở dữ liệu. SQL có thể được dùng như sự kết hợp

giữa cơ sở dữ liệu và trang web. Trong cơ sở dữ liệu trên máy chủ SQL sẽ thực hiện
việc truy cập thông tin và kết quả hiển thị trên trang web khi người dùng yêu cầu. Và
SQL cũng là công cụ để cập nhật thông tin cho CSDL đó.
Có một điều đặc biêt đó là SQL rất dễ sử dụng, bạn không cần phải biết lập trình,
khơng nhất thiết phải là chun gia tin học mà vẫn có thể xử lý cơng việc nhờ SQL.
Làm được điều đó là nhờ có các cơng cụ trực quan Query giúp tạo ra các câu lệnh SQL
một cách hiệu quả, dễ dàng. Mỗi Query là một câu lệnh SQL được xây dựng hồn
chỉnh và ghi lại để có thể mang ra sử dụng bất cứ lúc nào.
1.3.4 Làm quen với SQL Server
Nếu muốn mở Microsoft SQL Server Management Studio, đầu tiên cần phải đăng
nhập. Khi cài đặt ở phần chọn quyền login, ta chọn Mixed Mode để có thể cho phép
login bằng cả 2 quyền đó là Windows và SQL Server. Tiếp theo hãy chọn server type
và nhập tên server của mình, sau đó chọn quyền login, rồi click vào Connect.

16


Phía trên là cửa sổ Object Explorer, cửa sổ chính để thực hiện hầu hết các thao tác
nếu tương tác với database với hình thức giao diện. Cịn Database Object lại là nơi lưu
trữ database của SQL và user. Với database của SQL mặc định sẽ có các database hoặc
có thêm các tùy chọn cài đặt.

CHƯƠNG 2
THIẾT KẾ VÀ XÂY DỰNG TRANG THÔNG TIN ĐIỆN TỬ
CHO CÔNG TY ĐỨC DUY
2.1. Thiết kế CSDL
Dưới đây là csdl với các cột để cho các cột liên kết với nhau

17



2.2. Thiết kế giao diện
Giao diện trang chủ:
Phần header

Phần Navigation

18


Phần footer

Giao diện sản phẩm Dell
Page 1 của Laptopdell
19


Page 2 của Laptop Dell

20


Giao diện sản phẩm Apple
Page 1 của Laptop Apple

21


Page 2 của Laptop Apple


22


Page 3 của Laptop Apple

Giao diện sản phẩm Accer
Page 1 của Laptop Accer

23


Page 2 của Laptop Accer

24


Giao diện sản phẩm Asus
Page 1 của Laptop Asus

Page 2 của Laptop Asus

25