ݺߣ

ݺߣShare a Scribd company logo
BÁO CÁO THỰC TẬP TUẦN 2
ĐỀ TÀI:
ỨNG DỤNG WEB XÂY DỰNG PHẦN
MỀM QUẢN LÝ SINH VIÊN - HỌC SINH
Giáo viên hướng dẫn: Thầy Võ Đỗ Thắng
Sinh viên thực tập: Trần Văn Anh
Tuần 1: 23/7/201430/7/2014
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
Tạo database, nhập
dữ liệu
Thiết kế giao diện
cho trang ứng dụng
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
I. Tạo database, nhập dữ liệu .
- Cơ sở dữ liệu (database): kho thông tin về một
chủ đề, được tổ chức hợp lý để dễ dàng quản lý
và truy tìm.
- Thông thường, những thông tin trong CSDL
được chia thành nhiều mẫu tin có cấu trúc tương
đối giống nhau, ví dụ như đây là một mẫu tin:
• MSSV: A01
• Họ sinh viên: Trần Văn
• Tên Sinh viên: Anh
• Nơi sinh: Lâm Đồng
• Ngày sinh: 24/07/1993
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
- Cách tạo CSDL:
I. Tạo database, nhập dữ liệu .
• Vào My SQL
Nhập mật khẩu đăng nhập MySQL
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
- Cách tạo CSDL:
I. Tạo database, nhập dữ liệu .
• Mở file SQL (athena.sql)
• Tạo bảng dữ liệu: Table (Bảng): Là một thành phần cơ
bản trong chương trình quản trị cơ sở dữ liệu quan hệ.
Bảng được hình thành khi sắp xếp các thông tin có liên
quan với nhau theo hàng và cột. Các hàng tương ứng
với các bản ghi (record) dữ liệu và các cột tương ứng
với trường dữ liệu
ví dụ: Tạo bảng sinh viên có các thông tin:
Id (khóa), MSSV, Họ sinh viên, Tên Sinh viên, Phái, Nơi
sinh, Ngày sinh, Mã Khoa
Tạo bảng điểm có các thông tin:
Id (khóa), MSSV, Mã môn học, Điểm
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
- Cách tạo CSDL:
I. Tạo database, nhập dữ liệu .
Cách 1: Tạo bảng bằng code
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
- Cách tạo CSDL:
I. Tạo database, nhập dữ liệu .
Cách 2: Tạo bảng bằng tool của phần mềm
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
- Kết quả:
I. Tạo database, nhập dữ liệu .
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
- Nhập dữ liệu: tương tự cũng có 2 cách
I. Tạo database, nhập dữ liệu .
Cách 1:
Cách 2:
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
Giới thiệu về HTML
HTML là ngôn ngữ dùng để mô tả một trang web.
HTML viết tắt của từ Hyper Text Markup Language.
HTML không phải là ngôn ngữ lập trình, html là ngôn ngữ đánh dấu
(markup language), ngôn ngữ đánh dấu là một nhóm các thẻ đánh
dấu (các tag), HTML sử dụng các thẻ này để mô tả trang web.
Cấu trúc cơ bản của trang HTML có dạng như sau, thường gồm 3
phần:
<!Doctype>: Phần khai báo chuẩn của html.
<head></head>: Phần khai báo ban đầu, khai báo về meta , title
, css , javascript…
<body></body>: Phần chứa nội dung của trang web, nơi hiển thị nội
dung.
PHP (viết tắt hồi quy "PHP: Hypertext Preprocessor") là
một ngôn ngữ lập trình kịch bản hay một loại mã lệnh chủ yếu
được dùng để phát triển các ứng dụng viết cho máy chủ, mã
nguồn mở, dùng cho mục đích tổng quát. Nó rất thích hợp
với web và có thể dễ dàng nhúng vào trang HTML.
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
Đoạn mã sau minh họa giúp cách viết PHP lồng vào các trang HTML
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
Phần mềm XAMPP : để dựng server chạy PHP
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
Giao diện (gồm: banner và menu ngang ) cho trang ứng dụng
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
Phần banner
Sử dụng thư viện javascript-image-slider
Trang kham khảo: http://www.menucool.com/javascript-image-slider
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
Phần menu ngang: DROPDOWN MENU VỚI CSS3
Phần HTML:
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
CSS cho menu
Hiển thị cái liên kết trên cùng một hàng, màu nền cho menu.
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
CSS Menu con
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
Sau đó, chúng ta sẽ đặt chiều rộng cho các liên kết là 250px, cùng
với một số thứ khác.
CSS cho các liên kết
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
Kết quả:
TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL
II. Thiết kế giao diện cho trang ứng dụng.
Báo cáo tuần 2

More Related Content

Báo cáo tuần 2

  • 1. BÁO CÁO THỰC TẬP TUẦN 2 ĐỀ TÀI: ỨNG DỤNG WEB XÂY DỰNG PHẦN MỀM QUẢN LÝ SINH VIÊN - HỌC SINH Giáo viên hướng dẫn: Thầy Võ Đỗ Thắng Sinh viên thực tập: Trần Văn Anh Tuần 1: 23/7/201430/7/2014
  • 2. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL Tạo database, nhập dữ liệu Thiết kế giao diện cho trang ứng dụng
  • 3. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL I. Tạo database, nhập dữ liệu . - Cơ sở dữ liệu (database): kho thông tin về một chủ đề, được tổ chức hợp lý để dễ dàng quản lý và truy tìm. - Thông thường, những thông tin trong CSDL được chia thành nhiều mẫu tin có cấu trúc tương đối giống nhau, ví dụ như đây là một mẫu tin: • MSSV: A01 • Họ sinh viên: Trần Văn • Tên Sinh viên: Anh • Nơi sinh: Lâm Đồng • Ngày sinh: 24/07/1993
  • 4. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL - Cách tạo CSDL: I. Tạo database, nhập dữ liệu . • Vào My SQL Nhập mật khẩu đăng nhập MySQL
  • 5. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL - Cách tạo CSDL: I. Tạo database, nhập dữ liệu . • Mở file SQL (athena.sql) • Tạo bảng dữ liệu: Table (Bảng): Là một thành phần cơ bản trong chương trình quản trị cơ sở dữ liệu quan hệ. Bảng được hình thành khi sắp xếp các thông tin có liên quan với nhau theo hàng và cột. Các hàng tương ứng với các bản ghi (record) dữ liệu và các cột tương ứng với trường dữ liệu ví dụ: Tạo bảng sinh viên có các thông tin: Id (khóa), MSSV, Họ sinh viên, Tên Sinh viên, Phái, Nơi sinh, Ngày sinh, Mã Khoa Tạo bảng điểm có các thông tin: Id (khóa), MSSV, Mã môn học, Điểm
  • 6. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL - Cách tạo CSDL: I. Tạo database, nhập dữ liệu . Cách 1: Tạo bảng bằng code
  • 7. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL - Cách tạo CSDL: I. Tạo database, nhập dữ liệu . Cách 2: Tạo bảng bằng tool của phần mềm
  • 8. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL - Kết quả: I. Tạo database, nhập dữ liệu .
  • 9. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL - Nhập dữ liệu: tương tự cũng có 2 cách I. Tạo database, nhập dữ liệu . Cách 1: Cách 2:
  • 10. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng. Giới thiệu về HTML HTML là ngôn ngữ dùng để mô tả một trang web. HTML viết tắt của từ Hyper Text Markup Language. HTML không phải là ngôn ngữ lập trình, html là ngôn ngữ đánh dấu (markup language), ngôn ngữ đánh dấu là một nhóm các thẻ đánh dấu (các tag), HTML sử dụng các thẻ này để mô tả trang web. Cấu trúc cơ bản của trang HTML có dạng như sau, thường gồm 3 phần: <!Doctype>: Phần khai báo chuẩn của html. <head></head>: Phần khai báo ban đầu, khai báo về meta , title , css , javascript… <body></body>: Phần chứa nội dung của trang web, nơi hiển thị nội dung.
  • 11. PHP (viết tắt hồi quy "PHP: Hypertext Preprocessor") là một ngôn ngữ lập trình kịch bản hay một loại mã lệnh chủ yếu được dùng để phát triển các ứng dụng viết cho máy chủ, mã nguồn mở, dùng cho mục đích tổng quát. Nó rất thích hợp với web và có thể dễ dàng nhúng vào trang HTML. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng. Đoạn mã sau minh họa giúp cách viết PHP lồng vào các trang HTML
  • 12. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng. Phần mềm XAMPP : để dựng server chạy PHP
  • 13. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng. Giao diện (gồm: banner và menu ngang ) cho trang ứng dụng
  • 14. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng. Phần banner Sử dụng thư viện javascript-image-slider Trang kham khảo: http://www.menucool.com/javascript-image-slider
  • 15. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng. Phần menu ngang: DROPDOWN MENU VỚI CSS3 Phần HTML:
  • 16. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng. CSS cho menu Hiển thị cái liên kết trên cùng một hàng, màu nền cho menu.
  • 17. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng. CSS Menu con
  • 18. TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng. Sau đó, chúng ta sẽ đặt chiều rộng cho các liên kết là 250px, cùng với một số thứ khác.
  • 19. CSS cho các liên kết TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng.
  • 20. Kết quả: TRIỂN KHAI ỨNG DỤNG TRÊN LOCAL II. Thiết kế giao diện cho trang ứng dụng.