Tải bản đầy đủ (.docx) (20 trang)

Báo cáo thực tập TMA academy website

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (856.1 KB, 20 trang )

ĐẠI HỌC QUỐC GIA THÀNH PHỐ HỒ CHÍ MINH
ĐẠI HỌC CÔNG NGHỆ THÔNG TIN
KHOA CÔNG NGHỆ PHẦN MỀM

THỰC TẬP TỐT NGHIỆP

TMA Academy Website

Công ty thực tập: TMA Solutions
Lớp: SE501.L11.PMCL
Sinh viên thực hiện: Trần Ngọc Tồn – 17521142

TP. Hồ Chí Minh, ngày 15 tháng 01 năm 2021


Trần Ngọc Toàn
2

Thực tập tốt nghiệp

NHẬN XÉT
(Của giảng viên)

............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................


............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
............................................................................................................................................................
........................................................................................................................

2
2


Trần Ngọc Toàn
3

Thực tập tốt nghiệp

MỤC LỤC

3
3


Trần Ngọc Tồn

4

Thực tập tốt nghiệp

LỜI NĨI ĐẦU
Ngày nay, ngành công nghiệp phát triển ứng dụng web là một bộ phận không thể
thiếu của ngành công nghiệp phần mềm. Với tốc độ phát triển vô cùng mạnh mẽ, ngành
phát triển ứng dụng web đã và đang là nhân tố kích thích sự phát triển của cơng nghệ
thơng tin thế giới, cả về phần cứng và phần mềm.
Cùng với xu thế phát triển của thế giới, Việt Nam cũng không phải ngoại lệ.
Ngành công nghiệp phát triển web non trẻ Việt Nam đã và đang phát triển mạnh mẽ, để
hòa nhập với những công ty hàng đầu về xây dựng nền tảng web trên thế giới. Bên cạnh
sự phát triển của web thì những ngành nghề được tiếp cận người dùng một cách nhanh
chóng như những gì ta có thể thấy là mạng xã hội hay những website bán hàng trực tuyến
cũng đang rất thịnh hành trên cả thế giới lẫn Việt Nam.
Sau ba năm học tập trên trường, do mong muốn có thêm kinh nghiệm thực tế,
cũng như muốn được tìm hiểu, bổ sung kiến thức trong một mơi trường chuyên nghiệp,
em có dự định là sẽ thực tập trong học kì. Vì vậy, em quyết định chọn Cơng Ty TMA
Solutions- một môi trường lý tưởng, hiện đại, chuyên nghiệp - là nơi sẽ giúp em thực
hiện được dự định này.

4
4


Trần Ngọc Toàn
5

Thực tập tốt nghiệp


LỜI CẢM ƠN
Em xin chân thành cảm ơn ban giám hiệu và quý thầy cô trường Đại học Công
nghệ thông tin đã cung cấp và bồi dưỡng cho em những kiến thức cơ bản trong suốt 4
năm ngồi trên giảng đường đại học, để từ đó em có nền tảng áp dụng vào đợt thực tập
một cách hiệu quả nhất có thể.
Em xin gửi lời cảm ơn quý Công Ty TMA Solutions đã tạo điều kiện cho em thực
tập tại công ty cũng như cung cấp, bổ sung cho em những kiến thức mà em cịn thiếu sót.
Q cơng ty đã hỗ trợ em rất nhiều trong suốt thời gian thực tập vừa qua, dạy em những
kỹ năng cần thiết, truyền đạt cho em những kinh nghiệm mà các anh chị đã trải qua trong
quá trình làm việc, trao đổi với khách hàng, tác phong và tinh thần trách nhiệm trước
công việc được giao, những suy nghĩ tích cực. Các anh chị cũng đã tạo cho em nhiều điều
kiện để ứng dụng những kiến thức đã học vào thực tế để xây dựng những dự án thực tiễn
đi từ lúc ban đầu, nâng cao trình độ, cũng như tốc độ lập trình và trí thức thêm một bậc.
Em xin chân thành cảm ơn.
Vì kiến thức bản thân còn hạn chế cũng như là lần đầu tiên được va chạm và tiếp
xúc với thực tế, áp dụng lý thuyết vào cơng việc nên bản thân cịn bỡ ngỡ và lúng túng,
khơng tránh khỏi những thiếu sót, mong q Thầy (Cơ) có thể đóng góp ý kiến để em có
thể hồn thiện hơn.
Em xin chân thành cảm ơn!

Trần Ngọc Tồn
TP. Hồ Chí Minh, ngày 29 tháng 09 năm 2020

5
5


Trần Ngọc Tồn
6


Thực tập tốt nghiệp

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

I.

Giới thiệu công ty TMA Solutions

Vào tháng 3 năm 1997, bà Bùi Ngọc Anh thành lập công ty TMA với 6 kỹ sư tại
phòng khách nhà bà. Sau hơn 20 năm phát triển, hiện tại công ty đang sở hữu 6 trụ
sở R&D tại Việt Nam và các văn phòng đại diện nằm trên khắp các châu lục trên
thế giới.
TMA Solutions hiện chỉ đứng sau FPT Software xét về đội ngũ nhân lực nhưng
dẫn đầu trong một số lĩnh vực chuyên biệt về phần mềm viễn thông, cạnh tranh
chính với các cơng ty lớn của Ấn Độ.
II.

Sản phẩm của công ty








TMA Solutions chuyên cung cấp các sản phẩm phần mềm phục vụ nhiều
loại hình dịch vụ khác nhau, đem lại trải nghiệm tốt nhất cho người dùng.
Các dịch vụ công ty chuyên cung cấp:
Visual Design

Software Testing
Porting & Migration
Production Support
IT Managed Services
Software Development




Cung cấp giải pháp cho nhiều lĩnh vực:
Telecom
Finance & Insurance
6

6


Trần Ngọc Toàn
7




Thực tập tốt nghiệp

E-Commerce, Retail & Distribution
Media & Publishing
Logistics & Transportation

CHƯƠNG 2: NỘI DUNG THỰC TẬP

Đợt thực tập vừa qua đã giúp sinh viên được đào tạo về xây dựng thiết kế
giao diện và trải nghiệm người dùng, cũng như là hiện thực thiết kế bằng kỹ năng
phát triển website chủ yếu về mặt front-end đồng thời rèn luyện những kỹ năng
mềm như làm việc nhóm, thuyết trình, giao tiếp. Tại cơng ty, sinh viên có cơ hội
được học tập, khám phá và làm việc trong một môi trường chun nghiệp.
I.

Tìm hiểu cơng ty và các kỹ năng cơ bản trong công ty

Thời gian: 2 ngày
Nội dung: Giới thiệu công ty, team T-Design, cách tổ chức trong team
Được nghe anh Team Manager giới thiệu về team cũng như cơng ty, q trình
thành lập và phát triên (như đã nhắc đến ở trên), quy trình làm việc từ cao xuống thấp,
cách thức tổ chức của cơng ty .
Ngồi ra, thực tập sinh còn được giới thiệu về cách thức làm việc trong công ty
như thời gian đi làm, các quy định cần phải tuân thủ, cách sử dụng skype trong công
việc…
Kết quả : Hiểu thêm về Công ty TMA Solutions, team T-Design cách công ty đưa ra các
giải pháp cho đối tác . Có thêm các kỹ năng về việc sử dụng skype trong cơng việc, làm
việc có kế hoạch, có kỷ luật, có trách nhiệm hơn

II.

Nghiên cứu kỹ thuật
a. Cơng cụ làm việc

Thời gian: 1 ngày
Nội dung: Tìm hiểu về các công cụ sẽ sử dụng trong quá trình làm việc.
Qua ngày tiếp theo, được các anh chị trong team hướng dẫn các công cụ
● Figma: Phần mềm thiết kế giao diện người dùng giúp tạo ra các thiết kế có

thể review liên tục và dễ dàng hiện thực thành web hoặc mobile app.
● VSCode: IDE phục vụ cho việc lập trình hiện thực thiết kế.
● Gitlab: Hệ thống git phục vụ cho việc trao đổi code giữa các bên liên quan
7
7


Trần Ngọc Tồn
8

Thực tập tốt nghiệp

● Skype: Sử dụng chính trong các cuộc trao đổi và meeting giữa các bên liên

quan của dự án cũng như trong team.
● Trello: Công cụ quản lý task được giao
Kết quả: Hiểu được cách sử dụng các công cụ, cách kết hợp các công cụ để phục
vụ cho cơng việc
b. Tìm hiểu về cách thiết kế trải nghiệm người dùng
Thời gian: 3 ngày
Nội dung: Tìm hiểu về kiến thức tạo ra thiết kế trải nghiệm người dùng của team
Đọc các tài liệu về thiết kế trải nghiệm người dùng, hiểu được quy trình thiết
kế của team:
● Nghiên cứu và phân tích:
o Business Goal Analysis
Hiểu được business goal, user insight để đảm bảo rằng sản phẩm được thiết
kế đúng hướng để phát triển doanh nghiệp
o Personas Design
Đại diện cho tập người dùng mục tiêu. Phân tích cách họ nghĩ, hành động và
cảm nhận trong mỗi ngữ cảnh

o User Testing
Quan sát, thực hiện phỏng vấn và tập trung các nhóm để đánh giá các user
insight và hành vi của họ. Sử dụng usability testing để hiểu được cách người
dùng tương tác với ứng dụng và website.
● Thiết kế UX:
o Information Architect
Tổ chức thông tin, chức năng 1 cách rõ rang và logic để giúp người dùng dễ
dàng điều hướng giữa các màn hình trong hệ thống
o Sketch
Phác thảo và tinh chỉnh các ý tưởng giải pháp thiết kế khác nhau trước khi
quyết định lựa chọn
o Wireframe
Tạo wireframe, là khung của trang web, ứng dụng và chứa đầy đủ thông tin
và chức năng của hệ thống.
● Thiết kế UI:
o Visual Design
Tạo giao diện cho hệ thống bằng cách sử dụng kiểu chữ, màu sắc, khoảng
trắng, hình ảnh và hình minh họa.
o Style guide
Xác định hướng dẫn cho các yếu tố thiết kế để đảm bảo tính nhất quán trong
toàn hệ thống.
8
8


Trần Ngọc Tồn
9

Thực tập tốt nghiệp


o UI Specification

Xác định thơng số kỹ thuật cho mọi yếu tố thiết kế trong thiết kế.
● Front-end Development:
o Front-end Development
Chuyển đổi tất cả thiết kế giao diện người dùng sang HTML, CSS và
Javascript, đảm bảo rằng ứng dụng trơng chính xác như được thiết kế và
chạy trơn tru trên các nền tảng khác nhau.
o UI Testing
Xem xét kết quả đầu ra từ nhóm phát triển và đảm bảo thiết kế được triển
khai chính xác.
Thực hiện:
- Tìm hiểu sâu hơn về các khâu của quy trình
- Cách sử dụng cơng cụ thiết kế, thiết kế 1 màn hình mẫu
Kết quả:
- Tăng thêm hiểu biết về kiến thức xây dựng trải nghiệm người dùng
- Thiết kế các màn hình chính phục vụ cho dự án
c. Tìm hiểu về HTML, CSS và JavaScript

Thời gian: 4 ngày
Nội dung; Được training những kiến thức quan trọng trong Html, css, JavaScript
- Sử dụng các thẻ <div>,

,… sắp xếp hợp lý, dễ đọc, dễ nhìn cũng như
phải sắp xếp các thẻ sao cho chuẩn SEO nhất. Đồng thời cũng tìm hiểu về
Html5
- Tổ chức css theo cấu trúc từ layout lớn đến các layout chi tiết, cũng như đặt
tên các class của element trong html sao cho phù hợp dễ đọc nhất. Và các
atribute css để trang web có một ui/ux tốt thân thiện với người dùng
- Responsive cho một trang website hồn chỉnh như thế nào.
- Tìm hiểu về jQuery (thư viện được viết từ Javascript).
- Tìm hiểu về Bootstrap 4 là một framework hỗ trợ tốt cho việc lập trình giao

diện một website
Thực hiện:
- Tham gia các buổi training
- Làm 1 giao diện website đã được thiết kế
Kết quả:
- Nâng cao kỹ năng lập trình HTML/CSS.
- Biết được một số quy tắc trong viết code html/css sao cho mọi người có thể
dễ đọc, dễ hiểu và dễ dàng sử dụng.
- Hoàn thành giao diện các trang đã thiết kế
9
9


Trần Ngọc Tồn
10

Thực tập tốt nghiệp

d. Tìm hiểu về Reactjs – Ant Design

Thời gian: 4 ngày
Nội dung:
- Khởi tạo 1 ứng dụng reactjs.
- Tìm hiểu về vịng đời của một component mới trong reactjs.
- Các kiến thức quan trọng như component,router, state, props, cách viết ES6,
chuyển từ html phân chia thành các component reactjs, cách gọi api bằng
axios, Redux,..
- Kiểm tra api thông qua postman.
- Biết được cách sử dụng ant design – là tập hợp hầu hết các thư viện về
reactjs như layout, notification, modal, checkbox, upload file, pagination,…

Thực hiện:
- Tạo ứng dụng mẫu bằng reactjs và ant-design
Kết quả:
- Nắm được các kiến thức về reactjs
- Nắm được cách để triển khai một ứng dụng web với reactjs
- Các trang được viết bằng reactjs và sử dụng các component của ant-design

III.

Thực hiện dự án

Sau một tháng được training và thực hành, thực tập sinh đã nắm được những
kiến thực cơ bản để tham gia vào project của công ty. Các tháng sau thực tập
sinh sẽ được tham gia vào các project của cơng ty.
IV.

Tuần
1

Lịch làm việc

Cơng việc
-

-

Người hướng
dẫn

Mức độ

hồn
thành

Nhận xét
của người
hướng dẫn

Tìm hiểu về Anh
Phạm
cơng ty, cách Tuấn Anh
tổ chức của
công ty.
Làm
quen
với các công
10

10


Trần Ngọc Tồn
11

Thực tập tốt nghiệp

-

2-6

-


6-11

12

cụ làm việc
trong cơng
ty.
- Học
cách
trao đổi, làm
việc
qua
skype.
Tìm hiểu quy trình
thiết kế, cơng cụ
thiết kế trải nghiệm
người dùng.
Thực hành tạo các
thiết kế cho các dự
án
Thiết kế giao diện
cho dự án internal
TMA-Academy
Review và đưa vào
để hiện thực trên
web
- Tìm
hiểu,
đọc tài liệu

về html css
- Tìm hiểu về
reactjs, antdesign
- Xây
dựng
giao
diện
cho
trang
web TMAAcademy
- Fix
bug
responsive,
lỗi hiển thị
- Chỉnh
sửa
giống
bản
design
- UI Testing
và deploy

Chị
Nguyễn
Trần Ái Trinh

Anh Trần Ngọc
Nông

Anh Tuấn Anh

và a Nông

11
11


Trần Ngọc Toàn
12

Thực tập tốt nghiệp

CHƯƠNG 3: CHI TIẾT DỰ ÁN
I.

Giới thiệu dự án

Website TMA-Academy được coi là 1 landing page dùng để phục vụ cho việc
thông tin cho mọi người về các khóa học do TMA tổ chức. Ngồi ra cịn có
trang chi tiết khóa giúp những mọi người có thể đăng ký các khóa học.
Website được thiết kế chuẩn SEO website với công nghệ mới nhất hỗ trợ tối
ưu cho kế hoạch truyền thông và điều đặc biệt hơn cả là website sẽ được tối
ưu nhất để có thể sử dụng trên nhiều nền tảng khác nhau.
Các màn hình chính:
1. Homepage

12
12


Trần Ngọc Toàn

13

Thực tập tốt nghiệp

13
13


Trần Ngọc Toàn
14

Thực tập tốt nghiệp

2. Giới thiệu

14
14


Trần Ngọc Toàn
15

Thực tập tốt nghiệp

15
15


Trần Ngọc Tồn
16


Thực tập tốt nghiệp

3. Khóa học

16
16


Trần Ngọc Toàn
17

Thực tập tốt nghiệp

17
17


Trần Ngọc Toàn
18

Thực tập tốt nghiệp

4. Thực tập

18
18


Trần Ngọc Toàn

19

II.

Thực tập tốt nghiệp

Thực hiện

Với sự giúp đỡ tận tình của chị Trinh về phần design và anh Nơng về lập trình front
end.
III.

Kế hoạch
1. Giai đoạn 1:

Thiết kế giao diện cho tất cả các trang, review đánh giá bởi chị Trinh
và chị Ngọc phịng marketing.
Kết quả: Hồn thành giao diện website trên bản thiết kế
2. Giai đoạn 2:
- Sử dụng reactjs và Ant-design xây dựng các trang
Kết quả: Hoàn thành giao diện website.
3. Giai đoạn 3:
- Fix bug, gửi cho anh chị phòng Academy test, anh Tuấn Anh test UI.
Deploy lên trang www.tma-academy.vn
-

TÀI LIỆU THAM KHẢO
For UI/UX Design:

UX Collective (uxdesign.cc)


For HTML, CSS, JS
/> />For Reactjs
/>ign/

19
19


Trần Ngọc Toàn
20

Thực tập tốt nghiệp

TỔNG KẾT
Như vậy, trong quá trình thực tập em đã học được nhiều kiến thức mới cả
trong kĩ năng chuyên môn về thiết kế UI/UX và lập trình web và cả kĩ năng xã hội
như làm việc nhóm, giao tiếp, thuyết trình. Nhờ tham gia vào các dự án thực tế của
công ty em đã có được kinh nghiệm làm việc góp phần phát triển bản thân trong
tương lai.
Chân thành cảm ơn sự giúp đỡ của các anh Trần Ngọc Nông và chị Nguyễn
Trần Ái Trinh đã chỉ dạy và giúp đỡ em trong quá trình thực tập.

20
20



×