Báo cáo thực tập lập trình FRONT END VIDOLE

Chân thành cảm ơn các anh chị trong nhóm trainer đã bỏ ra nhiều thời gian,công sức để hướng dẫn chúng em hoàn thành đợt thực tập này.. Đặc biệt cảm ơn anh Nguyễn Xuân Huy và anh Nguyễn H

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 FRONT-END VIDOLE

Công ty thực tập: Ant-Tech Company Người phụ trách: Nguyễn Xuân Huy - Nguyễn Hồng Quân Thực tập sinh: Phan Thanh Hoàng

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

LỜI MỞ ĐẦU

Trong thời đại 4.0, khi gần như mọi thông tin đều được đưa lên các trang web, mảng phát

triển và thiết kế web đóng vai trò là một trong những ngành quan trọng công nghệ thông

tin Do nhu cầu người dùng ngày càng cao nên việc phát triển web có tốc độ phát triển vô

cùng mạnh mẽ, liên tục thúc đẩy ngành công nghệ thông tin

Việt Nam không phải ngoại lệ Các công ty web ở nước ta không ngừng phát triển để theo

kịp, hòa nhập và cạnh tranh với các thị trường quốc tế

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ư

tham gia vào môi trường làm việc chuyên nghiệp nên em đã quyết định đi thực tập kì này

Vì vậy, em quyết định chọn Ant-Tech company- 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

LỜI CẢM ƠN

Trân trọng gửi lời cảm ơn Công ty Ant-tech company đã tạo điều kiện cho em có cơ hội được thực tập tại công ty

Chỉ trong một thời gian ngắn, nhưng nhờ sự chỉ dẫn nhiệt tình của nhóm trainer, nhóm thực tập chúng em đã tiếp thu được những kiến thức quan trọng để có thể làm được một website Chân thành cảm ơn các anh chị trong nhóm trainer đã bỏ ra nhiều thời gian,công sức để hướng dẫn chúng em hoàn thành đợt thực tập này

Đặc biệt cảm ơn anh Nguyễn Xuân Huy và anh Nguyễn Hồng Quân đã hướng dẫn, hỗ trợ

em trong lúc tìm hiểu và làm việc với framework Angular 2+, giải đáp thắc mắc về restful api, TypeScript, và các vấn đề khác liên quan đến http và OOP trong JavaScript

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ài báo cáo này

Phan Thanh Hoàng TpHCM, ngày 15 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 Giới thiệu công ty Ant-tech Company 6

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

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

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

2 Nghiên cứu kỹ thuật 7

2.1 Các công cụ làm việc 7

2.2 Tìm hiểu ngôn ngữ Javascript, Typescript, framework Angular 2+ 7

2.3 Lập trình website trên framework Angular 2+ 8

3 Thực hiện project 8

4 Lịch làm việc 8

Chương 3: Chi tiết về project 10

1.1 Home page 10

2 Kế hoạch 10

TÀI LIỆU THAM KHẢO 12

Chương 1: Giới thiêu công ty thực tập

1 Giới thiệu công ty Ant-tech Company

Ant-tech Company là công ty out-souce, công ty hiện đang có 2 trụ sở, 1 ở bên Pháp

và 1 ở Việt Nam, Công ty đã có nhiều dự án lớn như Polymate, Joynit, Yoggy Riêng

dự án joynit có cả 2 bản là mobile và web

Năm 2020 công ty quyết định thực hiện một dự án nữa mang tên Vidole với mục tiêu là giúp đặt sách online kể về các câu chuyện ở vùng Châu Phi và Ấn độ

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

- App, Web Joynit trên nền tảng mobile được phát hành năm 2020 Là một web kiểu mạng xã hội sự kiện, nơi mọi người có thể tạo sự kiện, mời người tham

gia và lưu lại hình ảnh của sự kiện nhất định

- Trong Năm 2020 công ty nhận được 1 dự án khác của một khách hàng ở Pháp

một dự án khác về kinh doanh sách online

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

Khi tham gia thực tập cùng với công ty, em được tham gia vào dự án Vidole với vai trò là front-end của dự án Đây là một sản phẩm về mảng kinh doanh

1 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 về công ty, cách tổ chức của công ty

Được nghe người phụ trách giới thiệu về công ty, quá 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

Ngoà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 email trong công việc…

Kết quả : Hiểu thêm về công ty Ant-tech, quá trình thành lập và phát triển Có thêm các

kỹ năng về việc sử dụng email trong công việc, làm việc có kế hoạch, có kỷ luật, có trách nhiệm hơn

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

2.1 Các công cụ làm việc

Thời gian : 4 ngày

Nội dung : Tìm hiểu về các công cụ sẽ được sử dụng trong quá trình làm việc

Trong thời gian này, supervisor đã hướng dẫn thực tập sinh tìm hiểu về các công cụ

sẽ giúp ích cho trong công việc sau này Một số phần mềm trong số đó như GIT - sử dụng trong làm việc nhóm, Postman– một phần mềm test api, Vscode và các extension

hỗ trợ

Thực hiện : Thực hành sử dụng các phần mềm đã nêu trên

Kết quả : Lập trình sử dụng các công cụ miễn phí, giúp dễ dàng kết hợp các công cụ

với nhau, so với việc dung các IDE

2.2 Tìm hiểu ngôn ngữ Javascript, Typescript, framework Angular 2+

Thời gian : 7 ngày (1 tuần)

Nội dung : Được training về các kỹ thuật Javascript nâng cao, những kiến thức quan

trọng cho việc tối ưu trên browser

- Lập trình hướng đối tượng

Các kiến thức cơ bản về lập trình hướng đối tượng như khái niêm, các đặc tính như tính kế thừa, tính đóng gói, tính ảo hóa, tính đa hình

- Quản lý bộ nhớ

Thực tập sinh sẽ được hướng dẫn về cách cấp phát, quản lý bộ nhớ sao cho tối ưu, tránh rò rỉ bộ nhớ

- Hiệu suất

Thực tập sinh được hướng dẫn cách code tối ưu để cải thiện suất chương trình

Thực hiện :

- Tham gia đầy đủ các buổi training của công ty

- Làm các bài thực hành, kiểm tra về kiến thức đã học

Kết quả :

- Nâng cao kỹ năng lập trình với ngôn ngữ Javascript

- Có được những kiến thức quan trọng cho việc lập trình front-end sau này

- Ngoài ra còn được biết thêm một số quy tắc trong việc viết code sao cho đúng chuẩn, dễ đọc, dễ hiểu

- https://github.com/airbnb/javascript - tổng hợp các qui tắc clean code trong js

2.3 Lập trình website trên framework Angular 2+

Nội dung : Lập trình với framework

- Định nghĩa về Angular 2+:

Angular2+ là một framework linh động dùng để thiết kế giao diện người dùng Được hỗ trợ bởi google và được tích hợp sẵn những phương thức để có thể làm việc với website dễ dàng hơn như http client, rxjs, angular router,

- Tạo website:

Được hướng dẫn tạo một website tĩnh bằng Angular2+, các kỹ thuật lập trình cùng với cách quản lý data, chia thư mục

3 Thực hiện project

Sau 2 tuần, thực tập sinh được training các kỹ năng lập trình để thực hiện project cùng với các anh chị trong công ty Tháng thứ 2, thực tập sinh được chia sẻ công việc cùng với anh chị trong công ty để cùng làm

Chi tiết đồ án sẽ được nói ở phần sau

4 Lịch làm việc

Tuần Công việc Người hướng dẫn

Mức độ hoàn thành

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

1

- Tìm hiểu về công ty, cách tổ chức của công ty

- Làm quen với các công cụ làm việc trong công ty

- Học cách trao đổi, làm việc qua email

Anh Nguyễn Xuân Huy

Hoàn thành

2

- Tìm hiểu ngôn ngữ lập trình nâng cao

- Thực hành Js và Angular 2+

Anh Nguyễn Hồng Quân

Hoàn thành

3 - Thiết kế trang chủ Anh Nguyễn Hồng

Quân

Hoàn thành

4 - Responsive cho

trang web

Anh Nguyễn Hồng Quân

Hoàn thành

5 - Tích hợp api Anh Nguyễn Hồng

Quân

Hoàn thành

6

- Thực hiện chức năng Chọn quẩn áo cho nhân vật

Anh Nguyễn Hồng Quân

Hoàn thành

7 - Tích hợp api Anh Nguyễn Hồng

Quân

Hoàn thành

Chương 3: Chi tiết về project

1 Giới thiệu về project Vidole

1.1 Home page

- Trang login là phần để user thực hiện đăng nhập

1.2 Responsive design

- Mô tả: giúp giao diện trang web thích ứng với mỗi màn hình điện thoại, máy tính

cụ thể

2 Kế hoạch

Giai đoạn 1:

- Hoàn thành Trang home page, chỉnh sửa các trang còn lại của trang web đúng design của khách hàng

- Reponsive website cho mọi loại máy

Kết quả :

- Mục tiêu hoàn thành

Giai đoạn 2:

- Hoàn thành Chọn đồ, màu da, tóc cho nhân vật

Kết quả :

- Mục tiêu hoàn thành

TÀI LIỆU THAM KHẢO

For framework

https://angular.io/docs

For languages

https://www.typescriptlang.org/

For package

https://getbootstrap.com/

https://github.com/angular/flex-layout

TỔNG KẾT

Như vậy, chỉ trong vòng 10 tuần ngắn ngủi, em được tham gia vào dự án cùng với các anh chị trong công ty để thực hiện vài chức năng của dự án Những yêu cầu mà anh chị đưa ra trong thời gian thực tập em đều hoàn thành

Chân thành cảm ơn sự giúp đỡ của các anh chị trong công ty đã giúp em để có thể hoàn thành website này