báo cáo thực tập frontend developer

Tại đây, tôi đã được tiếp xúc với nhiều dự án thực tế,học hỏi từ những người đồng nghiệp tài năng, và phát triển nhữnggiải pháp công nghệ sáng tạo.Báo cáo này sẽ phản ánh quá trình học t

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

FRONTEND DEVELOPER

Công ty thực tập: SparkMinds J.S.C

Người phụ trách: Nguyễn Tiến Đạt

Vương

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

LỜI MỞ ĐẦU

Bắt đầu hành trình thực tập tại công ty SparkMinds, tôi không chỉ mang theo hành trang là kiến thức từ giảng đường mà còn đầy ắp sự hứng thú và mong muốn học hỏi Trải qua gần ba tháng làm việc trong vai trò frontend developer, mỗi ngày tại công ty không chỉ là một thử thách mới mà còn là cơ hội để tôi mở rộng kiến thức và kỹ năng của mình Tại đây, tôi đã được tiếp xúc với nhiều dự án thực tế, học hỏi từ những người đồng nghiệp tài năng, và phát triển những giải pháp công nghệ sáng tạo

Báo cáo này sẽ phản ánh quá trình học tập và làm việc của tôi tại SparkMinds, nơi đã giúp tôi hiểu rõ hơn về vai trò của một frontend developer trong một môi trường làm việc chuyên nghiệp Từ việc phân tích nhu cầu của dự án, đến việc thiết kế và triển khai các giải pháp phần mềm, mỗi bước đi trong công việc đều mang lại cho tôi những kinh nghiệm quý giá Qua đó, tôi cũng muốn chia sẻ về những thách thức đã gặp phải và cách thức tôi vượt qua chúng, nhằm cung cấp một cái nhìn thực tế về công việc và sự nghiệp trong lĩnh vực công nghệ thông tin

2

LỜI CẢM ƠN

Em xin trân trọng gửi lời cảm ơn đến anh, chị ở công ty SparkMinds

đã tạo điều kiện cho em cơ hội được thực tập tại công ty Dù trong thời gian gần ba tháng nhưng nhờ sự chỉ dẫn nhiệt tình của anh Đạt,

em đã tiếp thu những kiến thức quan trọng để có thể tham gia một

dự án thực tế

Chân thành cảm ơn anh Đạt và các anh chị trong team Xáo đã bỏ ra nhiều thời gian, công sức để hướng dẫn, hướng dẫn, giúp đỡ em tận tình trong khi làm quen môi trường mới cũng như trong việc tiếp cận kiến thức công nghệ, kỹ năng lập trình và tư duy sản phẩm để có thể thực hiện tốt dự án cá nhân và dự án thực tế trong thời gian qua

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

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

2023

Trương Xuân Vương

NHẬN XÉT CỦA KHOA

4

MỤC LỤC LỜI MỞ ĐẦU 2

LỜI CẢM ƠN 3

NHẬN XÉT CỦA KHOA 4

MỤC LỤC 5

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

1.1 Giới thiệu công ty SparkMinds 6

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

1.2.1 Mobile App – Cryptocurrency Exchange Platform 7

1.2.2 Payment Application Development – Spay 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 9

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

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

2.2.1 Tuần 1 - 6 9

2.2.2 Tuần 7 - 11 9

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

2.3.1 Công nghệ 10

2.3.2 Mô tả dự án 10

2.3.3 Kết quả 10

2.4 Tham gia dự án thực tế 10

CHƯƠNG 3: TỔNG KẾT 12

3.1 Điểm mạnh 12

3.2 Điểm yếu 12

3.3 Chuẩn đạt được 12

6

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

1.1 Giới thiệu công ty SparkMinds

Hình 1.1 Logo công ty SparkMinds

SparkMinds là một công ty chuyên về Outsourcing Phát triển Phần mềm, được thành lập vào năm 2021 Bắt đầu sự nghiệp của mình bằng việc triển khai các dự án Blockchain, công ty đã gặt hái được thành công từ nhiều dự án Crypto Exchange Đang trên đà phát triển, SparkMinds đã mở rộng lực lượng lao động và cung cấp nhiều dịch vụ công nghệ trong nhiều lĩnh vực, như hệ thống ngân hang, tích hợp tài khoản, ứng dụng di động fintech, phần mềm tài chính doanh nghiệp, ứng dụng ví điện tử, … khắp nơi trên thế giới

Lịch sử phát triển của công ty:

Hình 1.2 Lịch sử phát triển của công ty SparkMinds

1.2 Sản phẩm công ty

1.2.1 Mobile App – Cryptocurrency Exchange Platform

 Tổng quan về sản phẩm: Dự án này liên quan đến việc xây dựng một Ứng dụng

di động cho nền tảng Giao dịch Tiền điện tử, dự trên nền tảng API đã có sẵn Ứng dụng di động này cần phải có tất cả các tính năng cần thiết của một sàn giao dịch tiền điện tử, bao gồm biểu đồ nến tích hợp, nhận dạng khuôn mặt người dung, và xác thực cho KYC (Know Your Customer), cũng như các chức năng giao dịch, nạp và rút tiền Ngoài ra, ứng dụng phải đảm bảo một kiến trúc hoạt động hiệu suất cao và đáp ứng yêu cầu bảo mật của khách hàng

 Các tính năng chính của sản phẩm:

o Trading (Buy/Sell)

o FIAT Deposit/Withdrawal

o Crypto Deposit/Withdrawal

o eKYC via Mobile App

o Candlestick Chart integration

o Customer helpdesk for mobile

 Giải pháp: Công ty đã phát triển dự án với một đội ngũ các lập trình viên có kinh nghiệp trong lĩnh vực blockchain, áp dụng phương pháp phát triển Hybrid app, lựa chọn các ngôn ngữ lập trình phù hợp, tích hợp Google Analytics & Sentry, và cũng áp dụng các quy tắc bảo mật cụ thể cho ứng dụng di động

1.2.2 Payment Application Development – Spay

 Tổng quan về sản phẩm: Spay là một ứng dụng thanh toán mà đội ngũ

SparkMinds phát triển nhằm giúp người dùng thực hiện các giao dịch thanh toán hoặc chuyển tiền nhanh chóng chỉ với kết nối internet Spay đáp ứng mọi nhu cầu thanh toán của bạn một cách nhanh chóng, tiện lợi, an toàn và với độ bảo mật thông tin cao Hơn nữa, ứng dụng còn có một số chức năng đặc biệt như tạo liên kết thanh toán, quét mã QR, và tăng cường bảo mật với các tiêu chuẩn PCI DSS…

 Các tính năng chính của sản phẩm:

o User Registration, Login, and Logout

o QR Code Payments

o Funds Deposit and Withdrawal

o Peer-to-Peer Money Transfer

o Seamless Bank Integration

o Access to Payment History

o Convenient Payment Link Generation

o Enhanced Security with PCI DSS Standard

o OTP Authentication for Added Security

 Giải pháp: Để tiết kiệm chi phí phát triển, công ty đã tận dụng sức mạnh của AI trong quá trình phát triển ứng dụng Ngoài ra, để giải quyết vấn đề thiếu hụt nhân lực, công ty quyết định sử dụng hybrid programming languages cho việc phát triển ứng dụng Cuối cùng, nhằm rút ngắn quá trình phát triển ứng dụng, công ty đã sử dụng các API và dịch vụ của bên thứ ba cho việc xử lý thanh toán, xác thực, và tăng cường bảo mật

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

Em tham gia thực tập tại công ty bắt đầu từ ngày 17 tháng 7 năm

2023 tới ngày 06 tháng 10 năm 2023, làm việc từ thứ 2 đến thứ 6 hàng tuần, có thể xin phép làm việc từ xa 2 ngày mỗi tuần nhằm phục vụ việc học Công việc hằng ngày bắt đầu từ lúc 8 giờ 30 phút sáng cho đến 6h00 chiều Thời gian nghỉ trưa khoảng 1 tiếng 30 phút từ 12h00 trưa cho đến 1h30 chiều Cuối mỗi ngày thực tập em đều báo cáo tiến độ công việc trong ngày bao gồm đã làm được những gì và các khó khăn gặp phải (nếu có), các thắc mắc sẽ được các anh hướng dẫn giải đáp, bên cạnh đó còn báo cáo về các công việc dự định sẽ làm vào ngày tiếp theo Phụ thuộc vào lộ trình thực tập mà có thể báo cáo tiến độ hàng tuần hoặc sẽ báo cáo cách tuần sau khi đã xong thời hạn làm bài tập, thông thường báo cáo tiến độ

sẽ vào cuối ngày thứ 6 hàng tuần, anh hướng dẫn sẽ review qua bài tập, kiến thức đã tìm hiểu và dựa vào đó sẽ đánh giá, cho điểm ở các giai đoạn thực tập Mỗi ba tháng sếp sẽ tổ thức một buổi nói chuyện

10

giữa các thành viên trong công ty, các chủ để có thể mở rộng, từ việc bàn luận về các công nghệ mới cho tới chia sẽ các vấn đề gặp phải trong cuộc sống

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: giới thiệu về công ty, cách tổ chức và các team của công

ty, được training về văn hóa công ty, văn hóa team, các quy định bảo mật của công ty, … Sau khi đã được training xong thì thực tập sinh phải vượt qua bài kiểm tra bảo mật với số điểm tối thiểu là 80, bên cạnh đó thực tập sinh sẽ được anh An (CEO của công ty) vấn đáp về văn hóa công ty để đánh giá xem mức độ hiểu biết về văn hóa công ty của mỗi thực tập sinh Ngoài ra mỗi thực tập sinh còn được cung cấp các công cụ, cũng như các tài khoản công ty để có thể tham gia công việc

Kết quả: hiểu biết thêm về công ty SparkMinds, được làm quen với những anh chị trong công ty Có thêm các kỹ năng sử dụng email, các công cụ hỗ trợ khi làm việc Nắm rõ được các nguyên tắc bảo mật của công ty

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

2.2.1 Tuần 1 - 6

Nội dung: Được giao tìm hiểu các công nghệ lập trình frontend web như là HTML, CSS, Javascript, ReactJS, Web Responsive, Bootstrap,

… Thời hạn tìm hiểu mỗi công nghệ là khác nhau tùy thuộc vào độ khó của chúng, chẳng hạn như HTML, CSS chỉ có thời hạn là một tuần để tìm hiểu và dựng giao diện theo mẫu có sẵn, còn đối với Javascript hoặc ReactJS thì có thời hạn 2 tuần để tìm hiểu kiến thức

và cách triển khai của chúng Cuối thời hạn tìm hiểu của mỗi công nghệ đều sẽ được review, đánh giá kiến thức đã tìm hiểu hoặc các bài tập được giao bởi anh Đạt (mentor, leader của team Xáo)

Kết quả: Nắm được kiến thức cơ bản về các công nghệ lập trình frontend web, dựng được các giao diện theo yêu cầu, các giao diện responsive trên các thiết bị khác nhau Hoàn thành các bài tập cơ bản dùng Javascript thuần cũng, cũng như các bài tập ở mức cơ bản làm quen với ReactJS Trả lời được các câu hỏi review kiến thức của mentor

12

2.2.2 Tuần 7 - 11

Nội dung: Thực hiện các bài tập mang tính nâng cao hơn của phần kiến thức ReactJS, cùng với tìm hiểu thêm về Typescrip và áp dụng

nó vào ReactJS Có hai bài tập lớn được xem là dự án cá nhân của phần này đó là xây dựng giao diện có tích hợp API được cung cấp cho admin, và người dùng của một trang web thương mại điện tử Kết quả: Hoàn thành được hai phần bài tập được giao, hiểu rõ được cách hoạt động của ReactJS, có áp dụng Typescript vào việc lập trình

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

2.3.1 Công nghệ

 ViteJS: hỗ trợ trong việc dựng cấu trúc thư mục cũng như các setup cần thiết cho source code, bên cạnh đó ViteJS còn có tốc độ build nhanh hơn các công

cụ khác

 ReactJS: xây dựng giao diện dựa trên các cú pháp JSX là mở rộng của HTML giúp linh hoạt hơn trong quá trình lập trình

 Typescript: hỗ trợ trong việc làm chặt chẽ hơn các ràng buộc cho biến, giúp phát hiện lỗi trong quá trình lập trình

 SCSS: được sử dụng thay thế cho CSS với các cú pháp viết có thể tái sử dụng được

 Bên cạnh đó còn có sử dụng một vài thư viện hỗ trợ khác như là: Axios, React Hook Form, React Router Dom, Redux/Redux Toolkit

2.3.2 Mô tả dự án

Xây dựng giao diện cho một trang thương mại điện tử dựa trên API được cung cấp, thời hạn hoàn thành bài tập trong vòng khoảng 5 tuần, trong đó bao gồm cả việc tìm hiểu Typescript Giai đoạn đầu của dự án được yêu cầu dựng giao diện cho trang admin với ReactJS không áp dụng Typescript có thời hạn là 2 tuần, có yêu cầu giao diện phải giống với mẫu thiết kế được giao và tương tác được với backend Giai đoạn tiếp theo của dự án sẽ là phần tìm hiểu về Typescript và áp dụng nó vào lập trình ReactJS, thời hạn là 3 tuần, có yêu giống với giao đoạn đầu nhưng có thêm light/dark mode và đa ngôn ngữ

2.3.3 Kết quả

Hoàn thành được tính năng cơ bản của một trang thương mại điện tử như là đặt hàng, thanh toán, quản lý các sản phẩm, danh mục, … Bên cạnh đó, còn thực hiện được các tính năng đa ngôn ngữ, light dark mode, áp dụng access token và refresh token để tăng tính bảo mật của trang web

2.4 Tham gia dự án thực tế

Vì tính bảo mật thông tin của dự án, cũng như khách hàng nên em không thể trình bày chi tiết về dự án, nên em xin phép được trình bày khái quát về vai trò của em trong dự

án cũng như những thuận lợi, khó khăn trong quá trình phát triển dự án

Sau khi đã hoàn thành 11 tuần thực tập về ReactJS, em đã được duyệt vào dự án thực

tế này với vị trí frontend developer thử việc Công việc của em được phân công trong

dự án là hỗ trợ cho anh Tùng (Junior Developer) lập trình giao diện cho trang web Ban đầu, em được phân công cho dựng các màn hình đơn giản như đăng nhập, đăng

ký, sau đó là đến các màn hình phức tạp hơn như trang chủ, thanh toán Bên cạnh đó

em cũng được phân công cho việc gắn api cho trang web Sau khi dự án đã triển khai được khoảng một tháng thì anh Tùng được rút khỏi dự án để tham gia đảm nhiệm các

dự án khác, em được chính thức tham gia đảm nhiệm phần giao diện cho dự án này

Về các khó khăn gặp phải: Ban đầu khi phải tiếp cận dự án với các souce code đã được dựng từ trước thì khá khó khăn cho việc hiểu được flow của code, cách triển khai các tính năng như thế nào cho phù hợp, các cách tương tác với api dựa trên cấu trúc có sẵn của source, chưa có kinh nghiệm trong dự án thực tế nên việc triển khai các hàm, các hook còn lộn xộn, thiếu tính tổ chức, khả năng giao tiếp trao đổi còn kém

Về thuận lợi: Được anh Tùng hướng dẫn lại flow của source cũng như sẽ review các Pull Request tính năng, từ đó cải thiện được cách tổ chức code, tối ưu hoá được việc đặt hàm Các anh chị trong team cũng hỗ trợ và giúp đỡ cải thiện hơn khả năng giao tiếp

14

CHƯƠNG 3: TỔNG KẾT

Quãng thời gian thực tập tại công ty SparkMinds đã giúp em cải thiện bản thân rất nhiều trong quy trình làm việc thực tế, tác phong của người kỹ sư phần mềm Được làm việc tại đây, em đã học thêm được kỹ năng mềm sử dụng mail, quản lý ticket, làm việc nhóm, giao tiếp với cấp trên, các kiến thức về lập trình web, cách làm việc hiệu quả với git, …

Với khoảng thời gian không quá dài, em đã có thể hoàn thành được các bài tập training cũng như dự án cá nhân, đạt được các yêu cầu

đề ra

Khi tham gia vào dự án thực tế, em cũng hoàn thành tốt các tác vụ đúng hạn và đạt chất lượng tốt

3.1 Điểm mạnh

 Tinh thần sẵn sàng học hỏi các kiến thức mới, tốc độ học hỏi các công nghệ mới khá nhanh

 Đảm bảo được thời hạn của các bài tập, công việc được giao

 Chăm chỉ trong công việc, thời gian training dự kiến là khoảng 3 tháng nhưng

đã có thể hoàn thành trong vòng 11 tuần

3.2 Điểm yếu

 Thời gian làm việc tại công ty không được cụ thể vì phải xin làm việc từ xa do lịch học

 Khả năng giao tiếp đã được cải thiện nhưng vẫn còn khá yếu

3.3 Chuẩn đạt được

Goal Mục tiêu môn học

G1 Nắm bắt được xu hướng, nhu cầu xã hội và tính đặc thù của doanh nghiệp G2 Hiểu và giải thích được các khái niệm cơ bản, thuật ngữ và sơ đồ hệ thống

trong dự án

G3 Nắm được quy trình, phương pháp và công nghệ phát triển sản phẩm phần

mềm tại doanh nghiệp

G4 Có khả năng tìm hiểu vấn đề, mô hình hóa vấn đề và tham gia giải quyết vấn

G5 Phát triển kỹ năng tư duy, kỹ năng làm việc nhóm và kỹ năng trình bày

G6 Đọc, hiểu các tài liệu và giao tiếp bằng tiếng Anh

16