Thực tập tốt nghiệp đề tài xây dựng website tin tức

Xây dựng giao diện cho website trên desktop Responsive trên mobile Áp dụng giao diện của mình vừa tạo vào website (không sử dụng theme ) Hiển thị được sản phẩm ra ngoài giao diện ới sự bùng nổ thông tin của Internet, vai trò của các trang thông tin điện tử tryuwjc tuyến ngày càng trở nên quan trọng. Khác với báo chí truyền thông có giới hạn thời gian cập nhật tin tức, các tờ báo trực tuyến đã cung cấp được sự tiện lợi trong việc cập nhật và phát hành thông tin. Về phía những người cung cấp thông tin, các nhà báo họ có thể dễ dàng cập nhật những tin tức mới nhất, thời sự nhất. Do đó việc sử dụng các trang thông tin trực tuyến luôn là điều cần thiết hiện nay nhằm đáp ứng nhu cầu cập nhật thông tin của mọi người Tin tức là những việc đã xảy ra dù tốt hay xấu, để giúp con người biết những chuyện xung quanh và trên thế giới. Ngày nay, nhờ thông tin truyền thông nhanh cho nên bất cứ chuyện gì vừa xảy ra ở đâu trên thế giới thì ta đề có thể biết ngay được , nhờ đó mà có thể học được nhiều cái hay cũng như tránh được những chuyện xấu có thể xảy ra như các trận sóng thần, bão lũ, các chất độc hại ảnh hưởng đến sức khỏe. Tin tức vô cùng quan trọng nó cho người ta tri thức và là cơ sở để tiến hành mọi việc lớn nhỏ. khi có Internet, Tin tức càng quan trọng vì tốc độ lan truyền nhanh ảnh hưởng ngay tức thì trên diện rộng

1 Nhận xét của cơ quan / Đơn vị về chất lượng công việc được giao:

Các công việc được giao:

⬜ Hoàn thành xuất sắc ⬜ Khá ⬜ Yếu

Hoàn tất công việc được giao:

⬜ Hoàn thành đúng ⬜ Thỉnh thoảng đúng ⬜ Không đúng thời hạn

Tính hữu ích của đợt thực tập với cơ quan

⬜ Giúp ích nhiều ⬜ Giúp ích ít ⬜ Không giúp ích mấy cho cơ quan

2 Nhận xét của cơ quan / Đơn vị về bản thân sinh viên:

2.1 Năng lực chuyên môn được sử dụng vào công việc được giao ở mức:

⬜ Giỏi ⬜ Khá ⬜ Trung bình ⬜ Yếu

2.2 Tinh thần, thái độ đối với công việc được giao:

⬜ Tích cực ⬜ Bình thường ⬜ Thiếu tích cực

2.3 Đảm bảo kỷ luật lao động (giờ giấc lao động, nghỉ làm, ):

2.4 Thái độ đối với cán bộ, công nhân viên trong Cơ quan / Đơn vị:

⬜ Hòa đồng ⬜ Không có gì đáng nói ⬜ Rụt rè

2.5 Khả năng sử dụng phần mềm văn phòng (office):

⬜ Giỏi ⬜ Khá ⬜ Trung bình ⬜ Yếu

3

2.6 Khả năng sử dụng Tiếng Anh:

⬜ Giỏi ⬜ Khá ⬜ Trung bình ⬜ Yếu

3 Nhu cầu nhân lực của cơ quan (kiến thức, kỹ năng, số lượng):

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

5 Đánh giá:

a Điểm chuyên cần, tác phong và đạo đức (Đạt/Không đạt):

b Điểm chuyên môn (Đạt/Không đạt):

Trưởng Cơ quan/Đơn vị

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

Người nhận xét

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

Email: khucxuanquy@gmail.com - nguyensan806@gmail.com

1 Nội dung thực tập: Xây dựng website tin tức

2 Yêu cầu:

- Xây dựng giao diện cho website trên desktop

- Responsive trên mobile

- Áp dụng giao diện của mình vừa tạo vào website (không sử dụng theme )

- Hiển thị được sản phẩm ra ngoài giao diện

10/2 - 1/3 Thiết kế giao diện toàn bộ trang web 100%

2/3 - 28/3 Code toàn bộ chức năng của trang

web

100%

29/3 - 31/3 Sửa lỗi và toàn thiện sản phẩm 100%

4 Nội dung chi tiết thực hiện

5

Hà Nội, ngày tháng năm 20

Xác nhận của Cán bộ hướng dẫn Sinh viên

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

6

LỜI CẢM ƠN

Trong quá trình làm đề tài này, em đã nhận được nhiều giúp đỡ để có thể

hoàn thành được đề tài

Em xin gửi lời cảm ơn đến các thầy cô trong khoa Công Nghệ Thông Tin -

Trường cao đẳng nghề Bách Khoa Hà Nội đã giúp đỡ chúng em có những

kiến thức để có thể hoàn thành được đề tài này

Đặc biệt, Em xin chân thành cảm ơn thầy giáo Đỗ Văn Uy đã tận tình hướng

dẫn, chỉ bảo chúng em trong suốt quá trình thực hiện đề tài cũng như thực

hiện báo cáo này

Xin cảm ơn anh Dương Đình Phúc đã giúp đỡ chúng em về mặt kinh nghiệm.

7

LỜI MỞ ĐẦU

Ngành công nghệ thông tin là một ngành khoa học đang trên đà phát triển mạnh và ứng dụng rộng rãi trên nhiều lĩnh vực Cùng với xu hướng phát triển của các phương tiện truyền thông như Báo, Radio… thì việc sử dụng internet ngày càng phổ biến Truy cập internet, chúng ta có được một kho thông tin khổnG lồ phục vụ mọi nhu cầu, mục đích của chúng ta chỉ bằng một cái nhấp chuột

Nhận thức được nhu cầu tìm hiểu thông tin, giải trí của xã hội là sự ra đời của hàng loạt Website cho các mục đích thương mại, giải trí, tin tức Để đáp ứng với việc cập nhật thông tin hành ngày, tình hình xã hội, chính trị, thời sự và sức khỏe…thì Website tin tức ra đời là một nhu cầu tất yếu

” Tin tức tích lũy trong mỗi chúng ta được gọi là kiến thức, tài sản quý giá nhất của con người”

Với sự bùng nổ thông tin trên internet, vai trò các trang thông tin điện tử trực tuyến càng trở nên quan trọng Khác với báo chí truyền thông có thời hạn thời gian cập nhập tin tức, các báo trực tuyến đã cung cấp được sự tiện lợi trong việc cập nhật và phát hành thông tin Về phía người dùng, họ có thể xem thông tin mọi lúc mọi nơi Về phía người cung cấp thông tin, các nhà báo, họ

có thể dễ dàng cập nhật những tin tức mới nhất, thời sự nhất Do đó việc sử dụng các trang thông tin trực tuyến luôn là điều cần thiết hiện nay, nhằm đáp ứng nhu cầu cập nhật thông tin của mỗi người

8

Mục lục

2.2.2 Use Case phân rã chức năng quản lý người dùng 15 2.2.3 Use Case phân rã chức năng quản lý bài viết 16

2.2.5 Use Case phân rã chức năng Báo cáo, thống kê 18 2.2.6 Use Case phân rã chức năng dành cho độc giả 19

9

10

Chương I Giới thiệu đề tài

1.1 Giới thiệu đề tài Website tin tức

Với sự bùng nổ thông tin của Internet, vai trò của các trang thông tin điện tử tryuwjc tuyến ngày càng trở nên quan trọng Khác với báo chí truyền thông có giới hạn thời gian cập nhật tin tức, các tờ báo trực tuyến đã cung cấp được sự tiện lợi trong việc cập nhật và phát hành thông tin Về phía những người cung cấp thông tin, các nhà báo họ có thể dễ dàng cập nhật những tin tức mới nhất, thời sự nhất Do đó việc sử dụng các trang thông tin trực tuyến luôn là điều cần thiết hiện nay nhằm đáp ứng nhu cầu cập nhật thông tin của mọi người

Tin tức là những việc đã xảy ra dù tốt hay xấu, để giúp con người biết những chuyện xung quanh và trên thế giới Ngày nay, nhờ thông tin truyền thông nhanh cho nên bất cứ chuyện gì vừa xảy ra ở đâu trên thế giới thì ta đề có thể biết ngay được , nhờ đó mà có thể học được nhiều cái hay cũng như tránh được những chuyện xấu có thể xảy ra như các trận sóng thần, bão lũ, các chất độc hại ảnh hưởng đến sức khỏe

Tin tức vô cùng quan trọng nó cho người ta tri thức và là cơ sở để tiến hành mọi việc lớn nhỏ khi có Internet, Tin tức càng quan trọng vì tốc độ lan truyền nhanh ảnh hưởng ngay tức thì trên diện rộng

1.2 Khảo sát hiện trạng

1.2.1 Khảo sát hiện trạng

Thói quen cập nhật và " tiêu thụ " thông tin báo chí không ngừng thay đổi, Đặc biệt trong bối cảnh khoa học và công nghệ phát triển với tốc độ cực kì nhanh như hiện tại.Thói quen cập nhật tin tức của độc giả cũng thay đổi liên tục trong khoảng thời gian rất ngắn Bài viết dưới đây là kết quả của một khảo sát do Trường Đại học Quốc Gia thành phố Hồ Chí Minh - trường Đại học khoa học xã hội và nhân văn khảo sát trên hơn 300 người( ở độ tuổi từ 16- 30) nguồn link cho thấy:

11

Từ những kết quả nghiên cứu được thì ta thấy rõ từ những năm trở lại đây đã có

sự thay đổi và chuyển dịch trong thói quen cập nhật tin tức của độc giả qua các vấn đề sau

- sự sụt giảm mạnh mẽ dễ nhận thấy của số lượng báo in Số lượng rất ít các bạn trẻ hiện nay cập nhật tin tức qua báo in như một nguồn cung cấp tin tức quan trọng

- Truyền hình dần mất đi sức hấp dẫn đối với công chúng, mất đi sức hấp dẫn về mặt thời

sự sự tiện ích khi theo dõi tin tức

- trong bối cảnh các độc giả hiện nay sử dụng chủ yếu là các thiết bị di động thông minh khả năng truy cập tin tức mọilúc mọi nơi Nên việc các trang báo ra đời nhằm phục vụ thói quen của công chúng

1.2.2 Website tương tự

Trên thị trường có rất nhiều website về tin tức như báo thanh niên, 24h, báo dân trí -

về các tin tức thời sự Báo mới , việt giải trí , vnexpress thường nói về các bài báo lá cải giải trí , thời trang

1.3 Mục tiêu

Website tin tức đặt ra những mục tiêu sau:

Người dùng có thể dễ dàng truy cập vào website thông qua mạng internet, dễ dàng tra cứu

và tìm kiếm thông tin Người dùng có thể thực hiện các thao tác mà họ muốn mà không gặp phải bất kỳ trở ngại nào

Người quản trị có quyền của người quản lý website theo từng chức vụ

- Thêm, sửa,xóa bài viết

- Sửa thông tin tài khoản , bài viết cũng như các nhân viên mình quản lý

1.5 Mô tả bài toán

● Khi mà Độc giả truy cập vào trang web sẽ thấy những tin tức được cập nhật mới nhất Click vào sẽ đọc chi tiết toàn bộ bài viết Độc giả có thể tìm kiếm tin tức theo keyword kết quả trả về sẽ là tên tiêu đề hoặc nội dung của bài viết liên quan đến keyword Độc giả có thể báo cáo bài viết khi thấy bài viết sai sự thật, bài viết sai chính tả hoặc nội dung bài viết chưa được hay và hấp dẫn

● Các bài viết sẽ được quản lý bằng 1 trang quản trị được phân cấp lần lượt theo : Admin, quản lý , nhân viên …

○ Khi muốn thêm ,sửa, xóa người dùng Admin hoặc quản lý sẽ click vào button chỉ chức năng tương ứng chỉ có Admin hoặc quản lý ( thêm các tài khoản của nhân viên mình quản lý) nhân viên chỉ có quyền sửa thông tin của chính mình

○ Khi muốn thêm ,sửa, xóa bài viết Admin hoặc quản lý sẽ click vào button chỉ chức năng tương ứng chỉ có Admin hoặc quản lý ( thêm,sửa, xóa các bài viết của nhân viên mình quản lý) nhân viên chỉ có quyền sửa,xóa thông tin bài viết của chính mình

○ Khi muốn chỉnh sửa, thêm, hay xóa chủ đề chỉ Admin mới có thể có thể làm việc này

○ Khi muốn xem các bài viết được độc giả báo cáo người dùng có thể click vào để sửa bài viết và xóa nội dung báo cáo khi đã được sửa hoặc bài viết

đã được xóa

13

Chương II Khảo sát và phân tích yêu cầu

2.2 Các chức năng được đề xuất của website

2.1.1 Chức năng dành cho người dùng

- Tìm kiếm và xem thông tin khóa học

- Báo cáo các bài viết sai chính tả, sai nội dung,

2.1.2 Chức năng dành cho người quản trị

- Thêm, sửa, xóa người dùng

- Thêm, sửa, xóa bài viết

- Thêm, sửa, xóa chủ đề

- Xem và xóa các bài báo do độc giả báo cáo

2.2 Phân tích chức năng của hệ thống

Hệ thống website (trang web) này có một thành phần chính là trang web tin tức với nhiều tin tức đến từ trong nước và ngoài nước

Hệ thống bao gồm hai tác nhân chính:

- Độc giả: là người có nhu cầu xem các tin tức được cập nhật trên trang web

- Người quản trị (Admin, quản lý, nhân viên): là người quản lý hệ thống web, quản lý các nội dung của website

14 2.2 Tổng quan chức năng

2.2.1 UseCase tổng quan

15 2.2.2 Use Case phân rã chức năng quản lý người dùng

16 2.2.3 Use Case phân rã chức năng quản lý bài viết

17 2.2.4 Use Case phân rã chức năng quản lý chủ đề

18 2.2.5 Use Case phân rã chức năng Báo cáo, thống kê

19

2.2.6 Use Case phân rã chức năng dành cho độc giả

2.2.7 Một số kí hiệu use case

Actor: có thể là người dùng, hoặc 1 hệ thống

nào khác bất kì

Use Case: Là các chức năng mà Actor sử dụng

Communication Link: Kết nối giữa các Actor và use

case, cho biết Actor đó có những sự tương tác nào với hệ thống

Boundary of System: kết nối giữa Actor và use case,

cho biết Actor đó có những sự tương tác nào với hệ thống

20

Relationship: Mối quan hệ giữa các Use Case với nhau

2.3 Tổng quan chức năng

2.3.1 Đặc tả Use case đăng nhập

Tác nhân Người dùng( Admin, quản lý , nhân viên)

Tiền điều kiện truy cập được vào trang quản lý

23

Tác nhân Người dùng( Admin, quản lý , nhân viên)

Tiền điều kiện người dùng đã đăng nhập

2.3.3 Đặc tả usecase quản lý bài viết

Mã use case UC003 Tên Use Case quản lý bài viết

Tác nhân Người dùng( Admin, quản lý , nhân viên)

Tiền điều kiện người dùng đã đăng nhập

Thêm bài viết

Tác nhân Người dùng( Admin)

Tiền điều kiện người dùng đã đăng nhập

4 Hệ

thố

ng

xóa và thông báo xóa thành công

2.3.5 Đặc tả use case Báo cáo

Tác nhân Người dùng( Admin)

Tiền điều kiện người dùng đã đăng nhập

Xem bài viết báo cáo

L S Th Hành

2.3.6 Đặc tả yêu cầu usecase Độc giả

Tác nhân Độc giả ( những người truy cập vào website đọc tin tức)

Tiền điều kiện truy cập được vào website theo link :news.laptrinhmaytinh.com

hoặc từ khóa news

Xem bài viết

42

2.4 Yêu cầu phi chức năng

- Xây dựng giao diện người dùng cho website trên desktop

-Responsive trên mobile

-Xây dựng giao diện quản trị

-Hiển thị được các khóa học ra bên ngoài giao diện người dùng, khi admin thêm hoặc sửa khóa học thì bên ngoài giao diện cũng phải được cập nhật theo

Chương III Công nghệ sử dụng

trong chương này em sẽ giới thiệu về các công nghệ sử dụng trong hệ thống website như ở chương 2 đã phân tích:

3.1 Front-end

3.1.1 VUE.JS

VueJS là một Framework dùng để xây dựng giao diện người dùng Vue được thiết kế từ đầu theo hướng cho phép và khuyến khích việc phát triển ứng dụng theo từng bước Có thể đáp ứng được với nhu cầu về SPA ( Single- Page Application)

Khác với các Framework nguyên khối (monolithic), Vue được thiết kế từ đầu theo hướng cho phép và khuyến khích việc phát triển ứng dụng theo từng bước Khi phát triển lớp giao diện ( View layer), người dùng chỉ cần dùng thư viện lõi (core library ) của Vue, vốn rất dễ học và tích hợp với những kĩ thuật khác

- Giúp website trở nên nhẹ hơn, tốc độ xử lý

trở nên nhanh hơn

- kích thước nhỏ gọn (Tỷ lệ thành công của

JavaScript framework sẽ phụ thuộc vào

kích thước của nó Kích thước càng nhỏ thì

công năng sử dụng càng nhiều Kích thước

của vue.js framework là 18–21KB, người

dùng sẽ không mất thời gian để tải xuống và

-Vuejs có hỗ trợ Server side rendering hay còn gọi là SSR, tuy nhiên việc không đơn giản như thế, để Rendering được HTML từ VueJs phí server cần phải tuân thủ sử dụng thuần VueJs và các Component của bên thứ 3 nhúng vào cũng phải tuân thủ đúng quy định về SSR Mà không đơn vị nào cũng hỗ trợ điều này ở thời điểm hiện tại

43

sử dụng Tuy nhiên, điều này không có

nghĩa là tốc độ chạy của vue.js thấp do kích

thước nhỏ Thay vào đó, vue.js đánh bại tất

cả các khung công tác cồng kềnh như

React.js, Angular.js và Ember.js.)

-Dễ dàng để tìm hiểu và phát triển Ứng dụng

Một trong những lý do framework này phổ

biến là nó tương đối dễ hiểu Nhờ cấu trúc

đơn giản của vue.js, người dùng có thể dễ

dàng thêm phần mềm vào dự án website

đang thực hiện của mình Cả hai mô hình

quy mô nhỏ cũng như quy mô lớn đều có

thể được phát triển thông qua framework

này, do đó tiết kiệm rất nhiều thời gian

Trong trường hợp xảy ra bất kỳ vấn đề nào,

người dùng cũng có thể dễ dàng tìm ra các

khu vực lỗi Tất cả là nhờ cấu trúc đơn giản

của vue.js.)

-Tích hợp đơn giản

nhờ kiến trúc MVVM khá dễ dàng trong việc

xử lý các HTML block

3.1.2 SASS

● SASS là bộ tiền xử lý cũng như ngôn ngữ lập trình dùng để hỗ trợ cho nền tảng cơ bản CSS Nhờ nó bạn sẽ có thể sắp xếp ngôn ngữ của CSS một cách dễ dàng và gọn gàng hơn bao giờ hết, đồng thời bạn cũng sẽ quản lý nhiều tệp biến đã định nghĩa sẵn từ trước Ngoài ra SASS khá hữu ích trong việc giúp bạn tiết kiệm dung lượng vì nó sẽ tự động nén tệp CSS lại

● phải qua một bộ lọc thì SASS hoặc SCSS mới sáng css bình thường

● Có 2 loại đuôi mà SASS hỗ trợ đó là: sass và scss

● Lưu file theo kiểu SASS thì rất chi tiết về dấu tab cũng như space

● Bởi vậy nên thường lưu file theo dạng đuôi là scss

44

-viết nhanh, không ngoặc, không cần ";"

ở cuối dòng => tốt cho người mới học

css và đã biết css rồi thì sẽ không quen

trắng (tab, space để thay cho việc ngăn cách giữa code css với nhau) Chỉ cần sai 1 dấu cách là lỗi

3.2 Back-end

3.2.1 NodeJS

NodeJS là một mã nguồn được xây dựng dựa trên nền tảng Javascript V8 Engine, nó được

sử dụng để xây dựng các ứng dụng web như các trang video clip, các forum và đặc biệt là trang mạng xã hội phạm vi hẹp NodeJS là một mã nguồn mở được sử dụng rộng bởi hàng ngàn lập trình viên trên toàn thế giới

- Một vài ưu điểm, nhược điểm của NodeJS

JSON APIs: Với cơ chế event-driven,

non-blocking I/O(Input/Output) và mô hình kết

hợp với Javascript là sự lựa chọn tuyệt vời

cho các dịch vụ Webs làm bằng JSON

Hiệu suất: Với sự chống lưng V8 JavaScript

Engine của Google và Event-drivent

non-blocking I/O có thể tải được hàng trăm nghìn

kết nối cùng lúc Nhưng cấu hình máy chủ

cho NodeJS rất khiêm tốn (tiết kiệm được 4

lần so với đầu tư thông thường - hiệu suất

tăng gấp đôi)

Ứng dụng nặng tốn tài nguyên: Nếu bạn

cần xử lý các ứng dụng tốn tài nguyên CPU như encoding video, convert file, decoding encryption hoặc các ứng dụng tương tự như vậy thì không nên dùng NodeJS (Lý do: NodeJS được viết bằng C++ & Javascript, nên phải thông qua thêm 1 trình biên dịch của NodeJS sẽ lâu hơn 1 chút.)