báo cáo thực tập lập trình WEB với SPRING BOOT và REACT

ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH 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 LẬP TRÌNH WEB VỚI SPRING BOOT VÀ REACT Công ty thực tập: FPT Software Ngườ

ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH 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

LẬP TRÌNH WEB VỚI SPRING BOOT VÀ REACT

Công ty thực tập: FPT Software Người phụ trách: Trần Vinh Quang Thực tập sinh: Hà Đăng Tú

Tp Hồ Chí Minh, tháng 1 năm 2021

LỜI MỞ ĐẦU

Với sự bùng nổ về công nghệ thông tin hiện nay, ngành kĩ thuật phần mềm đang là ngành dẫn đầu so với các ngành khác trong nhóm ngành công nghệ thông tin Với tốc độ phát triển mạnh mẽ, ngành kĩ thuật phần mềm đã và đang trở thành một phần không thể thiếu trong các ngành khác

Cùng với sự phát triển của thế giới, Việt Nam cũng không phải ngoại lệ Các công ty phát triển phần mềm tại Việt Nam cũng đang ấp ủ ước mơ mở rộng thị trường ra thế giới Điển hình có FPT Software, một công ty với hơn 20 năm làm phần mềm, nay đã có khách hàng ở một số nước như Nhật Bản, Singapore, Mĩ… góp phần đưa tên Việt Nam vào bản

đồ các nước có ngành công nghệ phát triển trên thế giới

Ngành phần mềm sinh ra là để hỗ trợ con người trong việc giải quyết, xử lý các vấn đề

về lưu trữ, tính toán… giúp tăng năng suất làm việc hơn Vì lý do này em quyết định, chọn lập trình phần mềm làm định hướng cho việc học tập của mình

Sau ba năm học tập tại trường, với mong muốn có thêm kiến thức, kinh nghiệm trong lĩnh vực phát triển phần mềm (Web) trong một môi trường chuyên nghiệp Em đã quyết định chọn FPT Software – một công ty với hơn 20 năm trong phát triển phần mềm với các khách hàng nước ngoài – là nơi để em thực hiện những mong muốn này

LỜI CẢM ƠN

Trân trọng cảm ơn công ty FPT Software đã tạo điều kiện cho em được thực tập để có thể phát triển kĩ năng theo hướng mà em đã chọn

Chỉ trong thời gian ngắn, các anh mentor trong team đã cho em biết được các kiến thức quan trọng trong việc xây dựng một website, trải nghiệm thực tế về quy trình phát triển một phần mềm Chân thành cảm ơn các anh đã bỏ thời gian, công sức giúp đỡ, giải đáp các thắc mắc trong thời gian thực tập Trân trọng cảm ơn anh Trần Vinh Quang đã giúp truyền đạt kiến thức về Spring boot, React

Cũng xin cảm ơn các thầy cô khoa Công nghệ Phần mềm đã giúp em thực hiện bài báo cáo này

Hà Đăng Tú

Tp Hồ Chí Minh, ngày 13 tháng 1 năm 2021

NHẬN XÉT CỦA KHOA

Mục lục

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 Thành tựu đạt được 6

Chương 2 Nội dung thực tập 6

2.1 Tìm hiểu công ty và các quy định của công ty 6

2.2 Nghiên cứu kĩ thuật 7

2.2.1 Tìm hiểu Spring Boot 7

2.2.2 Tìm hiểu React 8

Chương 1 Giới thiệu công ty thực tập 1.1 Giới thiệu công ty FPT Software

FPT Software được thành lập vào năm 1999, là một trong bảy công ty trực thuộc tập đoàn FPT Sau 20 năm thành lập, FPT Software có hệ thống khác hàng tại các thị trường nước ngoài như Nhật Bản, Đức, Pháp, Mĩ… là những thị trường lớn trên thế giới FPT Software hiện có các trụ sở đặt tại các thành phố lớn của cả nước Hà Nội, Đà Nẵng và Thành phố Hồ Chí Minh Với số nhân viên hiện tại khoảng trên 16000, FPT Software hiện là một trong những công ty công nghệ lớn nhất Việt Nam

1.2 Thành tựu đạt được

Trong suốt quá trình hoạt động FPT đã đạt được các chứng chỉ quốc tế như:

- Chứng chỉ CMMI Level 5 phiên bản cao nhất của CMMI

- Chứng chỉ ASPICE Level 3

- Chứng chỉ ISO/IEC 20000

- Chứng chỉ ISO 27001:2013

- Chứng chỉ ISO 14000

2.1 Tìm hiểu công ty và các quy định của công ty

Thời gian: 1,5 ngày

Nội dung: Giới thiệu công ty và cách tổ chức các bộ phận trong công ty Các công

cụ khi làm việc tại công ty, các quy định về bảo mật thông tin của trong công ty Được nghe các anh chị phụ trách giới thiệu về lịch sử hình thành của công ty, quá trình phát triển của công ty qua các thời kì, cơ cấu tổ chức từ cao xuống thấp, các công cụ hỗ trợ được sử dụng tại công ty

Ngoài ra thực tập sinh còn được nghe các quy định cần phải tuân thủ trong quá trình làm việc tại công ty, đặc biệt là các quy định về bảo mật thông tin

Kết quả: Hiểu thêm về công ty FPT Software, hiểu được các quy trình làm việc tại

công ty, cách sử dụng các công cụ hỗ trợ trong quá trình làm việc như yêu cầu hỗ trợ

kĩ thuật khi gặp phải sự cố về máy móc, xin nghỉ khi đau ốm… Sau cùng là hiểu các thiệt hại nếu vi phạm quy định về bảo mật thông tin

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

2.2.1 Tìm hiểu Spring Boot

Nội dung: Nghiên cứu Spring Boot trong việc dựng back-end của một trang web

- Giới thiệu Spring Boot

Spring Boot là một dự án được phát triển trong hệ sinh thái của Spring Framework Nó đường dùng để phát triển ứng dụng độc lập dựa trên Spring

- Ưu điểm của Spring boot

+ Có các tính năng của Spring Framework

+ Tạo ứng dụng độc lập, có thể chạy bằng java -jar (cho cả java web)

+ Nhúng trực tiếp các ứng dụng server (Tomcat, Jetty…) do đó không cần phải triển khai file WAR

+ Cấu hình ít, tự động cậu hình bất kì khi nào có thể (Giảm thời gian viết code, tăng năng suất)

+ Không yêu cầu XML config…

+ Cung cấp nhiều plugin

+ Chuẩn cho Microservices (Cloud support; giảm việc setup, config; các thư viện hỗ trợ…)

- Cách sử dụng tool để tạo một project chuẩn Spring Boot

+ Download project được cấu hình sẵn trên trang https://start.spring.io/

+ Mở project trên IDE và tiến hành build project, trong quá trình build project toàn bộ các gói thư viện cũng sẽ được download tự động mà không cần phải download thủ công

- Một số khái niệm annotation trong Spring JPA dùng trong việc mapping

dữ liệu trong cơ sở dữ liệu

+ @OneToOne: biểu diễn mối quan hệ 1-1 trong cơ sở dữ liệu + @OneToMany: biểu diễn mối quan hệ 1-n trong cơ sở dữ liệu + @ManyToMany: biểu diễn mối quan hệt n-n trong cơ sở dữ liệu

- Hướng dẫn phân chia project để thuận tiện cho việc nâng cấp, sửa chữa sau này

Chia project thành các gói với các chức năng riêng biệt

+ Gói entity: chứa các lớp entity làm nhiệm vụ lưu trữ dữ liệu của ứng dụng

+ Gói repository: chứa các lớp làm nhiệm vụ truy vấn, thao tác trên

cơ sở dữ liệu

+ Gói service: chứa các lớp service làm nhiệm vụ giao tiếp với các controller và các repository

+ Gói controller: chứa các lớp thực hiện nhiệm vụ xử lý các request

Kết quả:

- Hiểu được cơ bản cách hoạt động của Spring Boot

- Có thêm kiến thực trong việc tổ chức các file trong project

- Xây dựng được back-end xử lý chức năng đặt hàng, mua hàng

2.2.2 Tìm hiểu React

Nội dụng: Nghiên cúu React trong việc dựng front-end của một trang web

- Giới thiệu React React là thư viện javascript được phát triển bởi Facebook chuyên dùng

để lập trình UI (giao diện người dùng)

- Component trong React

Component giúp phân chia các UI thành các phân nhỏ để dễ dàng quản

lý và tái sử dụng

- Tìm hiểu về state, props trong React

Props và State là hai kiểu dữ liệu trong React, dùng dể hiển thị dữ liệu trên các component state thì private và chỉ có thể được thay đổi bên trong bản thân component Props thì mang tính external, và không bị kiểm soát bởi bản thân component Nó được truyền từ component cao hơn theo phân cấp, hay có thể hiểu đơn giản là truyền từ component cha xuống component con

- Giới thiệu JSX trong React

JSX là một extension của javascript, giúp cho lập trình viên có thể viết các tag giống các thẻ trong HTML Về bản chất, các tag thực sự là những lời gọi hàm, sẽ được chuyển đổi trong React code và end up dưới dạng HTML và Javascript trong cây DOM

- Lifecycle của component

Lifecycle của một component gồm 3 giai đoạn là Mounting, Updating

và Unmounting

+ Mounting là trạng thái khởi tạo môt component

+ Updating là trạng thái vẽ lại component sau khi các state và props thay đổi

+ Unmounting là trạng thái trước khi component bị hủy

Hình 2-1 mô tả chi tiết các trạng thái của một component từ khi được khởi tạo cho đến khi bị hủy

Hình 2-1 Lifecycle trong react

Kết quả:

- Hiểu được cơ bản cách thức hoạt động của React

- Tự tạo được một Component

- Hiểu được life cycle của một component trong react

TÀI LIỆU THAM KHẢO

https://spring.io/guides/gs/rest-service/

https://spring.io/guides/gs/consuming-rest/

https://reactjs.org/docs/introducing-jsx.html

https://reactjs.org/docs/components-and-props.html

https://reactjs.org/docs/state-and-lifecycle.html

https://reactjs.org/docs/handling-events.html

https://reactjs.org/docs/lifting-state-up.html