BÁO CÁO THỰC TẬP THỰC TẬP TỐT NGHIỆP LẬP TRÌNH FRONT-END VỚI REACT VÀ ÁP DỤNG QUY TRÌNH SCRUM - AGILE

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TINKHOA CÔNG NGHỆ PHẦN MỀM BÁO CÁO THỰC TẬP THỰC TẬP TỐT NGHIỆP - SE501.M21 LẬP TRÌNH FRONT-END VỚI REACT VÀ ÁP DỤNG QUY TRÌNH SCRUM - AGILE Building front

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN

KHOA CÔNG NGHỆ PHẦN MỀM

BÁO CÁO THỰC TẬP THỰC TẬP TỐT NGHIỆP - SE501.M21

LẬP TRÌNH FRONT-END VỚI REACT VÀ ÁP DỤNG

QUY TRÌNH SCRUM - AGILE Building front-end wih React and applying Scrum - Agile to project

Công ty thực tập: Công ty TNHH FPT Software Người phụ trách: Nguyễn Đức Nhân

Thực tập sinh: Ngô Công Hậu - 18520277

TP Hồ Chí Minh, tháng 6 năm 2022

LỜI MỞ ĐẦU

Trải qua quá trình học tập trên trường với nền tảng kiến thức từ thầy cô và bạn bè, vìmong muốn có thêm kinh nghiệm thực tế, cũng như được tham gia phát triển phần mềmtrong một môi trường chuyên nghiệp, em đã quyết định thực tập vào học kì này Sau khi tìmhiểu kĩ lưỡng giữa các công ty, em chọn công ty TNHH FPT Software làm nơi để áp dụngnhững kiến thức chuyên môn đã được đào tạo và để trải nghiệm thực tế văn hóa làm việctrong môi trường doanh nghiệp Với quy trình làm việc linh hoạt, hiệu quả, con người thânthiện, văn hóa tốt, có nhiều cơ hội phát triển, em nhận thấy đây thực sự là nơi thích hợp đểthực hiện những mong muốn trên của bản thân,

+

Cũng xin cảm ơn thầy cô và bạn bè trong khoa Công nghệ phần mềm đã nhiệt tình hỗtrợ và tạo điều kiện cho em làm bài báo cáo này.

Bản báo cáo dù đã được hoàn thành với tất cả nỗ lực tuy nhân vẫn sẽ không tránh khỏithiếu sót, rất mong nhận được sự thông cảm và góp ý chân thành từ thầy cô Em xin chânthành cảm ơn ạ

Thành phố Hồ Chí Minh, ngày 15 tháng 6 năm 2022

Ngô Công Hậu

NHẬN XÉT CỦA KHOA

CHƯƠNG 1 - GIỚI THIỆU CÔNG TY 1.1 Giới thiệu về công ty TNHH FPT Software

Được thành lập từ năm 1999, tiền thân thuộc tập đoàn FPT, FPT Software đã trởthành một trong những ông ty phát triền phần mềm lớn nhất Việt Nam Có chi nhánh ở hơn

11 quốc gia, với thị trường chính ở Hoa Kỳ, Châu Âu, Châu Á Thái Bình Dương, Việt Namcùng hơn 15000 lao động, bao gồm nhiều kỹ sư công nghệ Việt Nam và chuyên gia côngnghệ nước ngoài FPT Software đã đạt được những thành tích rất ấn tượng khi nằm trong top

100 nhà cung cấp dịch vụ phần mềm toàn cầu và được vinh dự là một trong hai nơi làm việctốt nhất Việt Nam trong lĩnh vực CNTT

Với tham vọng đổi mới công nghệ, đem lại sự hài lòng cao nhất cho khách hàng, cungcấp nhân viên môi trường làm việc thuận lợi nhất, FPT Software đã tạo nên sự khác biệt chomình nhờ 5 yếu tố

1 Chất lượng dịch vụ đạt chuẩn thế giới

2 Đáp ứng được nhu cầu khắt khe của các công ty hàng đầu

3 Luôn đi đầu về công nghệ

4 Nguồn nhân lực chuyên nghiệp

5 Giá thành cạnh tranh

Nhờ vậy FPT software đã vinh dự nhận các chứng chỉ thế giới về chất lượng và bảomật nhi: CMMI 5, ISO 27001: 2005, ISO 9001, ISO 20000 Tính đến nay công ty đã

hợp tác với những khách hàng là những nhà công nghệ hàng đầu thế giới nhi Hitachi,Neopost , IBM, Canon, Panasonic, Toshiba, Sony,…

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

Với bề dày 3 thập kỷ trong việc tạo dựng và phát triển các mô hình kinh doanh quy

mô lớn trong lĩnh vực phát triển các mô hình kinh doanh quy mô lớn trong lĩnh vực phầnmềm, FPT đã cung cấp các dịch vụ đạt tiêu chuẩn quốc tế ở các mảng:

+ Dịch vụ phần mềm truyền thống (Application Services, Business ApplicationServices, Legacy Migration, Testing & BPO

+ Dịch vụ Digital Age Services (Cloud, Mobility, Analytics & Internet of Things+ Dịch vụ Product Engineering bao gồm Embeded System, CAD/CAM và ICDesign

AkaBot – Giải pháp Robotic Process Automation, một sản phẩm đến từ FPT Software

CHƯƠNG 2 - NỘI DUNG THỰC TẬP 2.1 Tham gia khóa học Day One

● Thời gian: 2 ngày (onboarding)

● Nội dung chính:

+ Giới thiệu về công ty, quá trình thành lập và phát triển, sơ đồ tổ chức

+ Tìm hiểu các kênh thông tin, dịch vụ của công ty

+ Tìm hiểu các quy tắc về bảo mật trong công ty

+ Được hướng dẫn setup các thiết bi, giới thiệu sử dụng các nguồn tài nguyên của công

ty

+ Làm quen, giao lưu với các anh chị Các anh chị giới thiệu về các sản phẩm và những

thành tựu công ty đã đạt được

● Kết quả

+ Hiểu thêm về công ty FPT Software và tuân thủ luật công ty

+ Có thêm các kỹ năng về việc sử dụng các kênh thông tin để trao đổi hiệu quả trongdoanh nghiệp

2.2 Giai đoạn training

● Thời gian: 1 tháng (fundamental training)

+ Hiểu sâu hơn về các công nghệ phát triển web

+ Biết cách xây dựng các web project và cách giải quyết vấn đề thường gặp phải

+ Biết vận dụng cách quản lí mã nguồn bằng Git, phương pháp Agile, các nguyến tắcclean code, các mẫu thiết kế, an toàn trong ứng dụng web, …

2.3 Nghiên cứu về công nghệ của project

Một trong những điểm mạnh của React là cấu thành các UI component sử dụng JSX,

sự kết hợp của JS và HTML, giúp thực hiện các logic render dễ dàng hơn Ngoài ra React

sử dụng công nghệ Vỉtual DOM giúp so sánh sự thay đổi giữa các giá trị của lần rendernày với lần render trước và cập nhật ít thay đổi nhất trên DOM

2.3.2 State management với Redux

Redux là một predictable state management tool cho các ứng dụng Javascript Nó giúp bạn viết các ứng dụng hoạt động một cách nhất quán, chạy trong các môi trường khác nhau (client, server, and native) và dễ dàng để test Redux ra đời lấy cảm hứng từ tư tưởng của ngôn ngữ Elm và kiến trúc Flux của Facebook Do vậy Redux thường dùng kết hợp với React

2.3.3 Unit test với Jest và React testing library

Jest là một Javascript testing framework phổ biến và dễ sử dụng Những tính năng nổibật của Jest bao gồm số lượng matcher phong phú, cơ chế mock đơn giản, tài liệu rõràng

Đi kèm với Jest, dự án còn sử dụng React Testing Library, một thư viện hỗ trợ rendercác element dùng cho test, simulate user event và cơ chế async.

2.3.4 End to end testing với cypress

Cypress là front end testing tool được xây dựng cho các ứng dụng Web hiện đại Đây

là một công cụ hỗ trợ hữu hiệu cho developers và QA trong kiểm thử ứng dụng Webhiện đại Cypress được xây dựng trên một kiến trúc mới và chạy trong cùng vòng lặpchạy khi ứng dụng đang được thử nghiệm Cypress thường được so sánh với

Cypress được tích hợp sẵn test report giúp thể hiện rõ ràng các hành độngtrong lúc test.

2.3.5 Công cụ tổ chức UI components với Storybook

Storybook là một công cụ để phát triển giao diện người dùng Nó giúp việc phát triểnnhanh hơn và dễ dàng hơn bằng cách cô lập các UI Component Sử dụng Storybook ta có thểpreview UI, specifications và hành vi của từng component trước khi được đưa vào sử dụngtrong ứng dụng.

2.3.6 CI/CD với Jenkins

Project có áp dụng workflow CI/CD nên đỏi hỏi em phải hiểu quy trình build, deploy

và sửa lỗi khi cần thiết

2.4 Tham gia project thực tế với khách hàng

● Thời gian: 8 tuần

● Kết quả

+ Hiểu được thực sự cách làm việc trong thực tế của quy trình phát triển phần mềm theo

mô hình Scrum – Agile

+ Áp dụng kỹ thuật code trong một môi trường chuyên nghiệp

+ Rèn luện kỹ năng communicate, kỷ luật trong công việc, làm việc nhóm

CHƯƠNG 3 - CHI TIẾT VỀ PROJECT

3.1 Mô tả dự án

3.1.1 Tổng quát

Tên dự án: KBBATC

Mục tiêu: Phát triển và bảo trì ứng dụng website autotrader.com Trang web là một

marketplace để liên kết những người mua bán xe hơi Người dùng có thể mua bán xe mới, xe

cũ cùng những tính năng như 3D viewer, chạy thử, nhắn tin, customer support

Đối tượng hướng tới: Mọi công dân Mỹ và Úc có nhu cầu mua bán xe hơi.

Công nghệ:

 Frontend: React, Nextjs, Redux, Bootstrap, SCSS, Storybook

 Backend: Java Spring Boot

3.1.2 Một số chức năng chính

Trang tìm kiếm xe: Tìm kiếm xe theo các bộ lọc, vị trí hiện tại

3.2 Sản phẩm hoàn thành

Refactor, stabilize Offer component trong ứng dụng

Gắn các analytic taggings vào các element trên trang

Optimize thanh tìm kiếm xe

CHƯƠNG 4 - TỔNG KẾT 4.1 Các kết quả đạt được và ưu điểm

Sau kì thực tập, em đã thực hiện được nhiều việc, được đánh giá như sau:

Nhận xét về phong cách làm việc từ mentor và PM

Bản thân em thấy mình đã trưởng thành hơn trong công việc khi thực hiện:

● Học hỏi được kinh nghiệm thực tế từ dự án của công ty, từ kiến thức và kĩ năng về kĩ

4.2 Một số hạn chế

Tuy nhiên bất cứ dự án nào cũng gặp phải những bất lợi nhất định:

● Do dịch COVID 19 nên em không trực tiếp lên làm việc với công ty, gặp mặt các thànhviên, khiến gặp một số khó khăn về trao đổi công việc (Mạng internet, thời gian làm việckhông ổn định,…) Khắc phục: Cố gắng giữ liên lạc với team, chủ động hỗ trợ các thànhviên khác trong giờ làm việc

● Do còn ít kinh nghiệm nên tốn một số thời gian để làm quen công nghệ với cách làm việccủa doanh nghiệp Khắc phục: Trau dồi kiến thức và kỹ năng, học hỏi từ các anh chịsenior, PM

TÀI LIỆU THAM KHẢO

[1] React document: https://reactjs.org/

[2] FPT Software Offiical Website: https://www.fpt-software.com/

[3] Redux State Management: https://redux.js.org/

[4] Storybook: https://storybook.js.org/

[5] Bootstrap: https://getbootstrap.com/