báo cáo thực tập front end developer

Sau ba năm học tập trong trường, với mong muốn có thêm kinh nghiệp thực tế cũng như cơ hội để áp dụng những kiến thức đã học trong một môi trường chuyên nghiệp, em đã quyết định tham gia

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

Front-end Developer

Công ty thực tập: FPT Software HCM Người phụ trách: Hứa Tuấn Anh Thực tập sinh: Lê Trịnh Việt Tiến

TP Hồ Chí Minh, tháng 12 năm 2023

1

LỜI MỞ ĐẦU

Trong bối cảnh thế giới hiện nay, website trở thành một phần không thể thiếu trong cuộc sống của mỗi con người Và ngành lập trình web đang ngày càng phát triển với nhiều lĩnh vực, ngành nghề như giáo dục, y tế, báo chí, bán hàng, phim ảnh, ca nhạc,

Website là một môi trường tiềm năng và đầy hứa hẹn đối với các doanh nghiệp cũng như các công ty lớn nhỏ khác nhau Tuy nhiên để tạo ra được một website được nhiều người sử dụng cần rất nhiều yếu tố như nội dung, giao diện, hiệu suất, trải nghiệm người dùng cũng như lợi ích mà nó mang lại

Với sự phát triển của các framework như Angular, React và Vue đã giúp công nghệ web trở nên mạnh mẽ hơn nữa và mang lại trải nghiệm người dùng tốt hơn Để thử thách bản thân trong ngành công nghiệp web, em đã lựa chọn Front-end Developer là định hướng cho việc học cũng như nghề nghiệp trong tương lai

Sau ba năm học tập trong trường, với mong muốn có thêm kinh nghiệp thực tế cũng như cơ hội để áp dụng những kiến thức đã học trong một môi trường chuyên nghiệp, em đã quyết định tham gia vào FPT Software HCM – một môi trường lý tưởng và chuyên nghiệp để học tập và rèn luyện để phát triển bản thân

2

LỜI CẢM ƠN

Trước hết, em xin gửi lời cảm ơn đến quý Thầy Cô giảng viên trường Đại học Công nghệ Thông tin - Đại học Quốc gia TP.HCM nói chung và các Thầy Cô giảng viên khoa Công nghệ phần mềm nói riêng đã giúp đỡ và tạo điều kiện để em có cơ hội thực hiện quá trình thực tập tại doanh nghiệp

Em xin trân trọng gửi lời cảm ơn FPT Software HCM đã tạo điều kiện thuận lợi cho em cơ hội được thực tập tại công ty Dù trong thời gian ngắn nhưng nhờ sự chỉ dẫn nhiệt tình của nhóm mentor, em đã tiếp thu những kiến thức quan trọng để có thể tham gia một dự án thực tế Đặc biệt cảm ơn anh Hứa Tuấn Anh đã giúp đỡ, hướng dẫn và hỗ trợ em tận tình để em có thể làm việc trong môi trường mới

Cuối cùng em xin chúc quý Thầy Cô dồi dào sức khỏe và thành công trong sự nghiệp cao quý Đồng thời, kính chúc các cô, chú, anh, chị trong Công ty FPT Software HCM luôn mạnh khỏe và đạt được nhiều thành công trong công việc

TP HCM, ngày 27 tháng 12 năm 2023

Lê Trịnh Việt Tiến

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

1.1 Giới thiệu Công ty FPT Software 6

1.2 Sản phẩm công ty 6

1.2.1 FPT akaBot 6

1.2.2 FPT akaChain 7

1.2.3 FPT akaMES 8

1.3 Lịch làm việc khi thực tập tại công ty 8

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

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

2.2 Nghiên cứu kỹ thuật 10

2.2.1 Làm quen với các công cụ và cài đặt môi trường 10

Tiên phong trong chuyển đổi số, FPT Software cung cấp các dịch vụ đẳng cấp thế giới về Nhà máy thông minh, Nền tảng số, RPA, AI, IoT, Cloud, AR / VR, BPO, v.v với sự tuân thủ nghiêm ngặt các tiêu chuẩn toàn cầu Mới đây, FPT Software đã trở thành công ty Việt Nam đầu tiên và là công ty thứ 18 trên toàn thế giới đạt chứng chỉ TMMi level 5

1.2 Sản phẩm công ty

Với lịch sử lâu dài, FPT Software hiện đã nghiên cứu, phát triển được nhiều sản phẩm ứng dụng các công nghệ mới của cách mạng công nghiệp 4.0 Trong đó, có thể kể đến 3 sản phẩm, dịch vụ tiểu biểu, bao gồm:

1.2.1 FPT akaBot

Giải pháp tự động hóa quy trình bằng Robot (RPA) - Akabot cung cấp một nền tảng giúp doanh nghiệp tự động hóa các quy trình nghiệp vụ có các tác vụ lặp đi lặp lại với số lượng lớn giúp doanh nghiệp tăng năng suất, giảm chi phí vận hành

7 Giải pháp cho các quy trình thuộc nhiều lĩnh vực khác nhau:

 Tài chính

o Mở và đóng tài khoản

o Yêu cầu kiểm toán tài khoản

o Thanh toán bằng tiền tệ nước ngoài o Xử lí tiền bồi thường

1.2.2 FPT akaChain

Giải pháp Blockchain cho doanh nghiệp - akaChain là một giải pháp được hỗ trợ bởi blockchain cho phép các doanh nghiệp phát triển các ứng dụng có tính toàn vẹn dữ liệu cao, hạn chế vai trò của các trung gian dựa trên Hyperledger Fabric Các lĩnh vực áp dụng của akaChain bao gồm: hệ thống phần thưởng và lòng trung thành, eKYC và chấm điểm tín dụng, ID kỹ thuật số và truy xuất nguồn gốc

8 Mạng lưới đa chuỗi, được phép, đầu cuối dựa trên Hyperledger Fabric với nhiều giải pháp tích hợp áp dụng cho các lĩnh vực công nghiệp khác nhau

Lưu trữ dữ liệu riêng tư bằng mật mã để đảm bảo tính minh bạch và bảo mật, từ đó tạo ra một môi trường mạng công bằng và khách quan

akaMES được phát triển dựa trên nền tảng kỹ thuật cao tập trung hóa dữ liệu thông tin cho toàn nhà máy, cung cấp chức năng truy xuất ngược; thiết kế đáp ứng khả năng số hóa quản lý sản xuất theo thời gian thực, tích hợp quản lý và nâng cao khả năng tương tác giữa máy móc và còn người; hệ thống quản lý xuyên suốt toàn bộ các quy trình, công đoạn và hiển thị dữ liệu một cách trực quan hỗ trợ việc ra quyết định của các cấp lãnh đạo cũng như tính toán chi phí sản xuất thực tế

1.3 Lịch làm việc khi thực tập tại công ty

Em bắt đầu thực tập tại FPT Software HCM từ ngày 16/11/2023 tới 16/02/2024, thời gian làm việc của công ty là từ thứ hai đến thứ 6 hàng tuần Hàng ngày, bắt đầu làm việc từ 8 giờ và kết thúc lúc 17 giờ Thời gian nghỉ trưa khoảng 1 tiếng vào lúc 12 giờ Hàng ngày, em sẽ báo cáo tiến độ công việc, đặt câu hỏi và nhận chia sẻ, giải đáp từ anh hướng dẫn, đặt mục tiêu tiếp theo cần thực hiện

9 Ngoài ra, em luôn luôn có thể liên hệ mentor qua Microsoft Team bất cứ lúc nào nếu có thắc mắc hoặc vấn đề cần giải quyết Trong quá trình thực tập, em cũng có một buổi present với PM và mentor để đánh giá tiến độ hiện tại và giải thích về kế hoạch sắp tới

Hàng tháng, sẽ có một buổi Happy Hour để mọi người giải lao khoảng 10-15 phút Trong buổi Happy Hour này sẽ có các hoạt động vui chơi thú vị và bữa ăn nhẹ cho mọi người

10

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

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

Thời gian: 1 ngày

Nội dung: Tham gia buổi DayOne của công ty để được nghe giới thiệu về công ty, hiểu rõ về môi trường làm việc, sơ đồ tổ chức, hệ thống chính sách nhân sự, chính sách bảo hiểm Ngoài ra, còn được giới thiệu về văn hóa làm việc trong công ty như thời gian đi làm, quy định bảo mật thông tin,

Kết quả: hiểu thêm về FPT Sofware như quá trình thành lập, phát triển của công ty, văn hóa làm việc, sơ đồ tổ chức và các chính sách trong công ty Biết thêm về các tools cần thiết trong quá trình làm việc Học khóa Bảo mật thông tin - Information

Security Management System for Dayone 2.2 Nghiên cứu kỹ thuật

2.2.1 Làm quen với các công cụ và cài đặt môi trường

Thời gian: 1 ngày

Nội dung: Tìm hiểu các công cụ cần thiết trong quá trình làm việc tại công ty cũng như sau này:

 Microsoft Teams – cung cấp một môi trường làm việc điện tử cho các nhóm và tổ chức để giao tiếp, hợp tác, và chia sẻ tài liệu trong thời gian thực Teams tích hợp nhiều tính năng như trò chuyện nhóm, cuộc họp trực tuyến, chia sẻ tệp, tích hợp ứng dụng và nhiều tính năng khác, tạo điều kiện thuận lợi cho làm việc từ xa

 Microsoft Outlook - ứng dụng email và quản lý thông tin cá nhân phổ biến được phát triển bởi Microsoft Cung cấp các tính năng như gửi và nhận email, quản lý lịch làm việc, ghi chú,

11 danh bạ liên lạc, quản lý nhiệm vụ và nhiều tính năng khác Cho phép người dùng tổ chức công việc hàng ngày của mình, liên lạc qua email, lịch trình cuộc họp, quản lý công việc và tương tác với người khác thông qua email hoặc lịch trình  Visual Studio Code - trình soạn thảo mã nguồn mở và miễn phí

được phát triển bởi Microsoft Là một công cụ phổ biến cho việc phát triển phần mềm với nhiều ngôn ngữ lập trình khác nhau như JavaScript, Python, C++, và nhiều ngôn ngữ khác  Git - hệ thống quản lý phiên bản phần mềm, được thiết kế để

theo dõi các thay đổi trong mã nguồn khi phát triển phần mềm Git cho phép các nhà phát triển làm việc cùng nhau trên các dự án phần mềm một cách hiệu quả, ghi lại lịch sử các thay đổi, và quản lý việc tích hợp mã nguồn từ nhiều nguồn khác nhau  Node.js - môi trường thực thi mã nguồn mở dựa trên JavaScript,

được sử dụng chủ yếu để chạy mã JavaScript phía máy chủ Nó cho phép việc thực thi mã JavaScript không chỉ ở môi trường trình duyệt web mà còn ở môi trường máy chủ

Kết quả:

 Có được nhiều kiến thức và kỹ năng quan trọng để sử dụng các công cụ cho quá trình làm việc từ giờ về sau

 Hiểu rõ và nâng cao các kỹ năng sử dụng IDE, Git

 Biết thêm về chuẩn ES6 để giúp code Javascript tối ưu và rõ ràng hơn

2.2.2 Tìm hiểu về Javascript

Thời gian: 3 ngày

Nội dung: Ôn tập và học kỹ hơn về Javascript

12  Javascript có thể giúp cập nhật dữ liệu người dùng mà không cần tải lại trang giúp việc điều hướng trở nên mượt mà hơn, nâng cao trải nghiệm người dùng

 Nắm được các kiểu dữ liệu (number, string, array, object,…), cách khai báo biến và các lệnh cơ bản (if, for,…)

 Tìm hiểu về Arrow Function

 Học về array và map trong Javascript  Tìm hiểu về OOP trong Javascript

Kết quả: Nắm vững kiến thức nền tảng và nâng cao về Javascript và biết cách vận dụng cho công việc

2.2.3 Tìm hiểu về React

Thời gian: 5 ngày

Nội dung: Ôn tập và học kỹ hơn về React

 Với React chỉ cần xác định UI mong muốn và trường hợp cần hiển thị UI đó, React sẽ tự thực hiện các bước cần thiết để hiển thị  Tìm hiểu về Components và vòng đời của Components

 Sử dụng props để truyền dữ liệu giữa Components và tạo Components có thể tái sử dụng

 Hiểu và vận dụng state để quản lý trạng thái trong React  Học cách dùng memo() để tối ưu hiệu suất khi quản lý state  Dùng kỹ thuật Lift State Up để truyền trạng thái giữa các

component con thông qua component cha

 Khắc phục các hạn chế của Lift State Up bằng Context API  Tìm hiểu về các hook thông dụng trong React và học cách tự tạo

custom hook

 Học cách gửi http request để quản lý database

 Tìm hiểu về Routing trong React để xây dựng ứng dụng nhiều trang và chuyển đổi giữa các trang

13 Kết quả: Nắm vững kiến thức nền tảng và nâng cao về React và biết cách vận dụng cho công việc

2.2.4 Tìm hiểu về Redux

Thời gian: 3 ngày

Nội dung: Học thêm kiến thức mới về Redux

 Nhớ được các khái niệm cơ bản trong Redux: store, reducer, action,…

 Học các bước sử dụng redux để quản lý state

 Biết cách sử dụng Redux Toolkit giúp quản lý state dễ dàng hơn Kết quả: Hiểu thêm về Redux để biết thêm một phương pháp quản lý state khác Biết về workflow của Redux để sử dụng trong thực tế

2.2.5 Tìm hiểu về Typescript

Thời gian: 2 ngày

Nội dung: Học thêm kiến thức mới về Typescript

 Javascript chỉ cung cấp kiểu gõ động nên có thể tự suy ra kiểu dữ liệu của các biến hoặc tham số và sẽ thực thi mã với bất cứ kiểu dữ liệu mà nó nhận được

 Typescript là một ngôn ngữ lập trình, mở rộng và thêm kiểu static cho Javascript

 Tìm hiểu về các kiểu dữ liệu cơ bản (number, string, boolean, array, object,…)

 Biết thêm về kiểu định danh Aliases để đặt tên cho object

 Học về kiểu dữ liệu Union nhằm cho phép biến nhận 2 kiểu dữ liệu khác nhau

Kết quả: Biết về Typescript để thêm kiểu gõ tĩnh cho Javascript nhằm hạn chế các trường hợp nhập các đầu vào không mong muốn cho các hàm, biến,…

14

2.2.6 Tìm hiểu về Next.js

Thời gian: 5 ngày

Nội dung: Học thêm kiến thức mới về Next.js

 Fullstack framework for ReactJS, hỗ trợ Server-side Rendering, trang web chuẩn bị trên máy chủ thay vì máy khách

 File-based Routing giúp loại bỏ mã thừa, làm việc đơn giản, dễ hiểu hơn

 Build Fullstack App giúp dễ dàng thêm backend vào project cho phép lưu trữ vào cơ sở dữ liệu hoặc cái file, get data, thêm xác thực,

Kết quả: Biết kiến thức cơ bản về Next.js để xây dựng một fullstack website và các lợi ích tuyệt vời mà nó mang lại

2.2.7 Tìm hiểu về ArcGIS

Thời gian: 10 ngày

Nội dung: Học thêm kiến thức mới về ArcGIS

 ArcGIS cung cấp các công cụ mạnh mẽ hỗ trợ xây dựng bản đồ cũng như thực hiện phân tích không gian để khác thác chuyên sâu dữ liệu

 Tìm hiểu về Geodatabase – cấu trúc dữ liệu gốc trong ArcGIS  Tìm hiểu về Feature class – một trong các thuộc tính quan trọng

của Geodatabase để mô tả hiển thị các đối tượng trên bản đồ  Tìm hiểu về Raster dataset – một trong các thuộc tính quan trọng

của Geodatabase để thể hiện tất cả thông tin đia lý bằng cách chi thế giới thành các ô vuông hoặc hình chữ nhật

 Tìm hiểu về cách sử dụng Map Viewer và Scence Viewer của ArcGIS Online

15 Kết quả: Hiểu cơ bản về ArcGIS, các vấn đề liên quan và những điều cần thiết để thiết kế, xây dựng và phân tích bản đồ

2.2.8 Tìm hiểu về ArcGIS Experience Builder

Thời gian: hiện tại

Nội dung: Tìm hiểu tổng quan về ArcGIS Experience Builder

 Một công cụ mạnh mẽ giúp người dùng tạo ra các trải nghiệm tương tác và đa dạng

 Được thiết kế với giao diện kéo và thả, cho phép tạo ra các ứng dụng web tương tác, các trang thông tin địa lý, và các trải nghiệm trực quan chỉ trong vài bước đơn giản mà không cần kiến thức kỹ thuật sâu

 Tạo các bố cục, thêm các yếu tố tương tác như bản đồ, biểu đồ, hình ảnh, và các phần tử multimedia để tạo ra các trải nghiệm động  Hiển thị thông tin địa lý một cách trực quan và thu hút qua bản đồ,

thông tin vị trí và các tương tác dựa trên vị trí

 Chia sẻ ứng dụng một cách dễ dàng hoặc nhúng nó vào trang web, giúp đẩy mạnh việc chia sẻ thông tin với người dùng khác

Kết quả: Hiểu cơ bản về ArcGIS Experience Builder Tuy nhiên do vấn đề kết nối của công ty nên chưa thể set up môi trường để làm việc với ArcGIS Experience Builder và hiện tại đã log ticket xin mở connection để có thể custom các tính năng cần thiết

2.3 Thực hiện dự án cá nhân

Trong quá trình thực tập tại công ty, vì project pending và không có task nên em chủ yếu chỉ học thêm kiến thức mới và làm các projects nhỏ chứ chưa được tham gia vào dự án thực tế

 Game sẽ lần lượt chuyển đổi giữa các ký tự “X” và “O” của 2 người chơi cho đến khi thỏa điều kiện để kết thúc ván đấu (hòa hoặc có người đáp ứng được điều kiện thắng)

 Game sẽ log và hiển thị các bước mà người dùng vừa chơi để người dùng có thể theo dõi ván đấu

Kết quả:

 Vận dụng các kiến thức được học như component, props, state,…  Biết cách sử dụng Lift State Up để truyền trạng thái giữa các

component

 Sau đây là một số hình ảnh của game:

Hình 2.1 – Màn hình khi chơi game

task nhỏ trong dự án Kết quả:

 Thành thạo các kiến thức cơ bản về Javascript và React  Biết cách sử dụng Refs để quản lý input và form

 Một số hình ảnh của Project:

18

Hình 2.3 – Màn hình bắt đầu

Hình 2.4 - Màn hình tạo dự án mới

 Trong Project này, người dùng lần lượt trả lời các câu hỏi và sẽ nhận được kết quả sau khi hoàn thành

Kết quả:

 Hiểu rõ về side effect và các sử dụng ContextAPI trong một dự án

 Một số hình ảnh của Project:

20

Hình 2.6 - Màn hình trả lời câu hỏi

Hình 2.7 - Màn hình kết quả

Hình 2.8 - Màn hình trang chính