ĐỀ tài tìm HIỂU ANGULAR FRAMEWORK và xây DỰNG WEBSITE QUẢN lý SÁCH CÔNG TY THỰC tập công ty TNHH công nghệ novahub

LỜI CẢM ƠNThời gian thực tập vừa qua em đã học hỏi thêm nhiều kiến thức thực tế và kĩ năng để áp dụng kiến thức đã học vào công việc.. Trước tiên em xin chân thành cảm ơn công ty TNHH cô

Trang 1

ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐẠI HỌC BÁCH KHOA KHOA CÔNG NGHỆ THÔNG TIN

Tel (+84.0236) 3736949, Fax (+84.0236) 3842771 Website: itf.dut.udn.vn, E-mail: cntt@dut.udn.vn

BÁO CÁO THỰC TẬP TỐT NGHIỆP

NGÀNH CÔNG NGHỆ THÔNG TIN

ĐỀ TÀI:

TÌM HIỂU ANGULAR FRAMEWORK

VÀ XÂY DỰNG WEBSITE QUẢN LÝ SÁCH

CÔNG TY THỰC TẬP:

Công ty TNHH Công Nghệ Novahub

SINH VIÊN: Lê Nguyễn Công Sang

MÃ SINH VIÊN: 102160111 LỚP: 16T2

CBHD: Trần Đinh Mạnh Linh

Đà Nẵng, 08/2020

Trang 2

LỜI CẢM ƠN

Thời gian thực tập vừa qua em đã học hỏi thêm nhiều kiến thức thực tế và

kĩ năng để áp dụng kiến thức đã học vào công việc Đó thực sự là trải nghiệm quý giá, bởi vậy em xin gửi lời cảm ơn tới tất cả mọi người đã hỗ trợ cho em hoàn thành đợt thực tập tốt nghiệp này.

Trước tiên em xin chân thành cảm ơn công ty TNHH công nghệ Novahub

đã nhiệt tình hướng dẫn và giúp đỡ em hoàn thành tốt quá trình học tập và thực tập của mình Công ty đã hỗ trợ em rất nhiều mặt về trang thiết bị tới giảng dạy nhưng kiến thức thực tiễn để áp dụng vào thực tế công việc Đặc biệt em xin cám ơn anh Trần Hải Thành, anh Trần Đinh Mạnh Linh đã tận tình hướng dẫn

và giúp đỡ em trong quá trình thực tập.

Em cũng xin gửi lời cảm ơn tới thầy cô khoa Công nghệ thông tin đã tạo cơ hội và điều kiện thuận lợi cho em được thực hiện đợt thực tập thực tế này Đây

là cơ hội cho em học hỏi thêm nhiều kiến thức thực tế, áp dụng những bài học trên ghế nhà trường vào thực tế công việc.

Một lần nữa em xin chân thành cảm ơn.

Lê Nguyễn Công Sang

TIEU LUAN MOI download : skknchat123@gmail.com

Trang 3

Công ty TNHH Công Nghệ NovaHub CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM

Độc lập - Tự do - Hạnh Phúc

PHIẾU ĐÁNH GIÁ KẾT QUẢ THỰC TẬP TỐT NGHIỆP

Họ và Tên sinh viên: Lê Nguyễn Công Sang Lớp: 16T2 Nhóm: 1610

Cơ quan/Đơn vị thực tập: Công ty TNHH Công Nghệ Novahub

Địa chỉ: Tầng 2 Tòa nhà Công ty Cổ phần Quản lý và Xây dựng đường bộ Quảng Nam

Đà Nẵng, 10B Nguyễn Chí Thanh, P Thạch Thang, Q Hải Châu, Tp.Đà Nẵng

Thời gian thực tập từ29/06/2020 đến 07/08/2020

Người hướng dẫn: Trần Đinh Mạnh Linh Email: linhtran@novahub.vn

1 Đánh giá về năng lực chuyên môn

Nội dung đánh giá Xuất sắc Tốt Khá T.Bình Yếu

Năng lực chuyên môn đáp ứng công việc x

Hoàn thành các công việc được giao x

Khả năng sử dụng ngoại ngữ x

Ứng dụng kết quả thực tập cho cơ quan x

2 Đánh giá về ý thức làm việc

Tinh thần, thái độ làm việc x

Tuân thủ kỷ luật (thời gian làm việc, báo x

nghỉ…)

Giao tiếp, quan hệ với cán bộ, công nhân viên x

3 Đánh giá kết quả công việc

Khả năng phân tích thiết kế hệ thống x

Khả năng học hỏi, nắm bắt công nghệ mới x

4 Các nhận xét khác (nếu có)

Trong thời gian thực tập em đã vận dụng tốt và nắm bắt nhanh các kiến thức được học,

hoàn thành nhiệm vụ được giao Bên cạnh đó, em cũng hòa đồng, nhạy bén và tuân thủ đúng nề nếp của công ty

5 Điểm đánh giá. Ghi bằng số: 10/10 Ghi bằng chữ: Mười điểm

Ngày 07 tháng 08 năm 2020

Xác nhận của cơ quan/đơn vị thực tập Người hướng dẫn

(Ký, ghi rõ họ tên và đóng dấu) (Ký và ghi rõ họ tên)

Trang 4

Trang 5

NHẬN XÉT CỦA NGƯỜI HƯỚNG DẪN

Trang 7

MỤC LỤC

CHƯƠNG I: GIỚI THIỆU CƠ QUAN THỰC TẬP 4

1.1 Tổng quan 4

1.2 Địa chỉ: 4 1.3 Lĩnh vực công nghệ: 5

CHƯƠNG 2: XÂY DỰNG CHƯƠNG TRÌNH QUẢN LÝ SÁCH BẰNG

ANGULAR 6

2.1 MÔ TẢ CÔNG VIỆC 6 2.1.1 Kế hoạch thực tập 6 2.1.2 Phương thức làm việc 6

2.2 CƠ SỞ KIẾN THỨC 6 2.2.1 Kiến thức cơ bản 6 2.2.2 Framework AngularJS 7

CHƯƠNG 3: TRIỂN KHAI VÀ ĐÁNH GIÁ KẾT QUẢ 10

3.1 Tóm tắt đề tài 10

3.2 Tính năng của chương trình 10

3.3 Kết quả triển khai 10

KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 14

TÀI LIỆU THAM KHẢO 15

ii

Trang 8

DANH SÁCH HÌNH ẢNH

1 Văn phòng Công ty TNHH Công Nghệ Novahub 4

Trang 9

Báo cáo thực tập tốt nghiệp

CHƯƠNG I: GIỚI THIỆU CƠ QUAN THỰC TẬP

1.1 Tổng quan

Novahub là một công ty phát triển phần mềm tại thành phố Đà Nẵng Đây là một công ty trẻ trung, năng động, tuy chỉ vừa mới thành lâp vào ngày 9 tháng 8 năm

2015 nhưng công ty đang không ngừng phát triển Mục tiêu hướng tới của công ty

không chỉ là gia công phần mềm mà còn đưa ra giải pháp, phát triển sản phẩm của

riêng mình

Hình 1 Văn phòng Công ty TNHH Công Nghệ Novahub

1.2 Địa chỉ:

Tầng 2 Tòa nhà Công ty Cổ phần Quản lý và Xây dựng đường bộ Quảng Nam

Đà Nẵng, 10B Nguyễn Chí Thanh, P Thạch Thang, Q Hải Châu, Tp.Đà Nẵng

SVTH: Lê Nguyễn Công Sang 4

Trang 10

Hình 2 Không gian làm việc

1.3 Lĩnh vực công nghệ:

• Java (Spring MVC)

• Ruby on Rails

• Swift (iOS)

Trang 11

CHƯƠNG 2: XÂY DỰNG CHƯƠNG TRÌNH QUẢN LÝ

SÁCH BẰNG ANGULAR

2.1 MÔ TẢ CÔNG VIỆC

2.1.1 Kế hoạch thực tập

Trong vòng gần 2 tháng thực tập, sinh viên sẽ được đào tạo công nghệ, quy trình làm việc và sau đó áp dụng để xây xựng sản phẩm Kế hoạch thực tập như sau:

- Đào tạo kiến thức cơ bản về HTML, CSS, TypeScript

- Giới thiệu framework AngularJS

- Hướng dẫn xây dựng website “Quản lý sách”

- Tổng kết và đánh giá

2.1.2 Phương thức làm việc

- Giờ làm việc: hành chính, sáng từ 8:00 đến 12:00, chiều từ 13:30 đến 17:30 Sinh viên phải có mặt đầy đủ các ngày từ thứ 2 đến thứ 6 trong tuần

- Quy trình: Daily report mỗi ngày, trình bày những công việc đã hoàn thành, những khó khăn gặp phải và những công việc sẽ làm

- Quản lý source: Quản lý source bằng công cụ Git thông qua dịch vụ lưu trữ

Github

2.2 CƠ SỞ KIẾN THỨC

2.2.1 Kiến thức cơ bản

• HTML: HTML (tiếng Anh, viết tắt cho HyperText Markup Language, hay là

"Ngôn ngữ Đánh dấu Siêu văn bản") là một ngôn ngữ đánh dấuđược thiết kế ra để tạo nên các trang web với các mẩu thông tin được trình bày trên World Wide Web Cùng với CSS và JavaScript, HTML tạo ra bộ ba nền tảng kỹ thuật cho World Wide Web HTML được định nghĩa như là một ứng dụng đơn giản của SGML và được sử dụng trong các tổ chức cần đến các yêu cầu xuất bản phức tạp HTML đã trở thành một chuẩn Internet do tổ chức World Wide Web Consortium (W3C) duy trì Phiên bản chính thức mới nhất của HTML là HTML 4.01 (1999) Sau

đó, các nhà phát triển đã thay thế nó bằng XHTML Hiện nay, HTML đang được phát triển tiếp với phiên bản HTML5 hứa hẹn mang lại diện mạo mới cho Web

SVTH: Lê Nguyễn Công Sang

Trang 12

• CSS: CSS là chữ viết tắt của Cascading Style Sheets, nó là một ngôn ngữ

được sử dụng để tìm và định dạng lại các phần tử được tạo ra bởi các ngôn ngữ đánh dấu (ví

dụ như HTML) Bạn có thể hiểu đơn giản rằng, nếu HTML đóng vai trò định dạng các phần tử

trên website như việc tạo ra các đoạn văn bản, các tiêu đề, bảng,…thì CSS sẽ giúp chúng ta có

thể thêm một chút “phong cách” vào các phần tử HTML đó như đổi màu sắc trang, đổi màu

chữ, thay đổi cấu trúc,…rất nhiều

• TypeScript: TypeScript là một ngôn ngữ mã nguồn mở miễn phí hiện đang được

phát triển và bảo trì bởi Microsoft Nó là tập cha của JavaScript, với các bổ sung các tuỳ chọn kiểu

tĩnh và lớp trên cơ sở lập trình hướng đối tượng cho ngôn ngữ này Anders Hejlsberg, kiến trúc sư

ngôn ngữ C# và là người tạo ra ngôn ngữ Delphi và Turbo Pascal đã tham gia phát triển

TypeScript TypeScript có thể sử dụng để phát triển ứng dụng chạy phía client, hay phía server

(Node.js) TypeScript được thiết kế để phát triển ứng dụng lớn và được biến đổi - biên dịch sang

JavaScript Vì TypeScript là tập cha của JavaScript nên bất kì chương trình JavaScript nào đã có

cũng đều là chương trình TypeScript hợp lệ TypeScript hỗ trợ định nghĩa các file chứa thông tin

kiểu của các thư viện JavaScript, giống như các file header của C/C++ mô tả cấu trúc của các file

object Điều này cho phép các chương trình khác sử dụng các giá trị được định nghĩa trong các file

giống như các thực thể TypeScript được định kiểu tĩnh Đó là các file header hãng thứ ba

(third-party) cho các thư viện thông dụng như jQuery, MongoDB, D3.js Các file header cho các module

cơ bản cho Node.js cũng có sẵn cho phép phát triển chương trình Node.js bằng

TypeScript

2.2.2 Framework AngularJS

AngularJS là một framework có cấu trúc cho các ứng dụng web động Nó cho phép bạn sử dụng HTML cho phép bạn mở rộng cú pháp của HTML để diễn đạt các thành

phần ứng dụng của bạn một cách rõ ràng và súc tích Hai tính năng cốt lõi: Data

Trang 13

binding và Dependency injection của AngularJS loại bỏ phần lớn code mà bạn

thường phải viết

Angular module (ES2015)

Theo đặc tả của ES2015 thì mỗi file là một module Có một module trong 1 file

và 1 file trên 1 module

Các module định nghĩa giới hạn của biến, function và class được định nghĩa trong module Các biến đó luôn là local trong module và không visible ra ngoài module

Các module không có public method hoặc các thuộc tính public không cần thiết

Module giúp chúng ta tạo một thành phần public sử dụng lệnh export Các module

khác có thể sử dụng các member public sử dụng lệnh import

Data binding

Angular sử dụng Data Binding để lấy dữ liệu từ Component đến View Nó được hoàn thành sử dụng cú pháp HTML đặc tả được biết đến là Template Syntax

Angular hỗ trợ 4 kiểu của Data binding:

Interpolation: Data được bind ra từ component sang view Property Binding: Data bind ra từ component sang thuộc tính HTML trong view

Event Binding: Các sự kiện DOM được bind ra từ view ra method của Component

Two-way binding/Model binding: Luồng dữ liệu cả hai chiều từ view sang component và ngược lại

Services

Service cung cấp dịch vụ cho các Components hoặc các service khác Angular không có bất cứ đặc tả nào cho Service nó chỉ là các class có export method và chứa

một số task

Dependency injection

Trang 14

Dependency Injection là một phương thức khi tự động tạo một instance của một service được inject vào một component hoặc một service khác khi nó được yêu cầu

Dependency injection được dùng hầu hết khi inject service vào component hoặc service khác

Angular làm điều này sử dụng injector Khi một component được tạo, Angular

sẽ tìm Component metadata các service mà component này yêu cầu Injector sẽ tạo

ra instance của service đó và inject vào component sử dụng constructor của nó

Nếu service đã tạo thì injector sẽ không tạo mà sử dụng lại Service cần chỉ ra cho Angular biết nó sẵn sàng được inject vào bất cứ component nào yêu cầu nó

bằng cách sử dụng @Injectable decorator

Trang 15

CHƯƠNG 3: TRIỂN KHAI VÀ ĐÁNH GIÁ KẾT QUẢ 3.1 Tóm tắt đề tài

Book Management - Ứng dụng cho phép người dùng quản lý sách

3.2 Tính năng của chương trình

- Quản lý sách

- Quản lý tác giả

- Quản lý thể loại

- Quản lý tài khoản

3.3 Kết quả triển khai

Hình 3: Giao diện login

Trang 16

Hình 4: Giao diện quản lý sách

Hình 5: Giao diện thông tin sách chi tiết

Trang 17

Hình 6: Giao diện quản lý tác giả

Hình 7: Giao diện chỉnh sửa thông tin tác giả

Trang 18

Hình 8: Giao diện quản lý tài khoản

Hình 9: Giạo diện quản lý thể loại

Trang 19

KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN

1 KẾT QUẢ ĐẠT ĐƯỢC

• Được thực hành với môi trường làm việc thực tế tại công ty và học hỏi thêm nhiều kiến thức về công nghệ mới

• Tìm hiểu và sử dụng framework Angular để lập trình web

• Áp dụng những kiến thức học được ở trường vào thực tế như phân tích, thiết

kế hệ thống, lập trình hướng đối tượng, lập trình web,…

• Nắm được quy trình làm việc trong quá trình phát triển phần mềm

2 KIẾN NGHỊ VÀ HƯỚNG PHÁT TRIỂN

Sau quá trình thực tập em cảm mình học hỏi được rất nhiều điều về cách làm việc, kiến thức chuyên môn, thái độ làm việc, … và đặc biệt là sự nhệt tình của các anh chị trong công ty dành cho em Em rất hy vọng sau này sẽ là một thành viên của công ty để được học hỏi và phát triển sau này

SVTH: Lê Nguyễn Công Sang

Trang 20

TÀI LIỆU THAM KHẢO

Internet

[1] https://www.angular.io

[2] TEDU Tổng quan kiến thức Angular và các khái niệm

Trang web:

https://tedu.com.vn/lap-trinh-angular-2-can-ban/tong-quan-kien-truc-angular-va-cac-khai-niem-261.html

Định dạng
Số trang	20
Dung lượng	540,02 KB