Báo Cáo Thực Tập Lập Trình Font End Reactjs.docx

1 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 FONT END REACTJS Công ty thực tập : TISOHA Người phụ trách : Đỗ Công Bá Thực tập sinh : Đinh Huỳnh Thái Bình TP Hồ Chí Minh, tháng 06 năm 2022 Đinh Huỳnh Thái Bình LỜI MỞ ĐẦU Trong thời đại nay, công nghệ Internet trở nên phổ biến không ngừng phát triển lĩnh vực Chính thế, phát triển Web trở thành yếu tố thiếu chiến lược truyền thông doanh nghiệp giới Cùng với xu phát triển giới, Việt Nam ngoại lệ Ngành công nghiệp phát triển ứng dụng web Việt Nam phát triển mạnh mẽ lĩnh vực thương mại, quảng cáo, giáo dục, Ngành lập trình Web sinh nhu cầu truy cập, tìm kiếm thơng tin nhu cầu khác.Vì lý này, em định chọn lập trình web làm định hướng cho việc học tập Sau ba năm học tập trường, mong muốn có thêm kinh nghiệm thực tế, muốn tham gia làm lập trình web mơi trường chun nghiệp, em có dự định thực tập Vì vậy, em định chọn TISOHA - môi trường lý tưởng, đại, chuyên nghiệp - nơi giúp em thực dự định Đinh Huỳnh Thái Bình LỜI CẢM ƠN Trân trọng gửi lời cảm ơn Công ty TNHH giải pháp phần mềm TISOHA tạo điều kiện cho em có hội thực tập công ty Chỉ thời gian ngắn, nhờ dẫn nhiệt tình, em tiếp thu kiến thức kinh nghiệm quan trọng lập trình font-end Reactjs Đặc biệt cảm ơn anh Đỗ Cơng Bá hướng dẫn, giúp đỡ em tận tình hồn thành công việc giao Cũng xin cảm ơn thầy cô 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 Đinh Huỳnh Thái Bình TpHCM, 15/12/2022 Đinh Huỳnh Thái Bình NHẬN XÉT CỦA KHOA Đinh Huỳnh Thái Bình MỤC LỤC Chương 1: Giới thiêu cơng ty thực tập 1.1 Giới thiệu công ty TISOHA .7 1.2 Sản phẩm công ty Chương 2: Nội dung thực tập 2.1 Tìm hiểu cơng ty kỹ công ty 2.2 Nghiên cứu kỹ thuật 2.2.1 Các công cụ làm việc 2.2.2 Đọc hiểu source code, fix bug giao .8 2.2.3 Thực project Chương 3: Các công việc làm 10 3.1 Xây dựng giao diện Mark Web 10 3.2 Xây dựng giao diện kết nối Api module quản lí Designer Admin Director 10 3.3 Xây dựng giao diện kết nối Api module quản lí Normal User 11 3.4 Xây dựng giao diện kết nối Api module Business Profile .11 3.5 Một số chức khác xuất file PDF, xem file PDF trình duyệt, Upload File .12 3.6 Một số hình ảnh giao diện ứng dụng 12 Đinh Huỳnh Thái Bình Chương 1: Giới thiêu công ty thực tập 1.1 Giới thiệu công ty TISOHA TISOHA công ty cung cấp giải pháp phần mềm đại, tiếp cận công nghệ cách khoa học có nghiên cứu 1.2 Sản phẩm công ty TISOHO phát triển dựa nhiều mảng trải từ Web, Mobile, Đinh Huỳnh Thái Bình Chương 2: Nội dung thực tập 2.1 Tìm hiểu cơng ty kỹ công ty Thời gian : ngày Nội dung : Giới thiệu công ty, cách tổ chức công ty Được nghe người phụ trách giới thiệu cơng ty, q trình thành lập 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ông ty Ngồi ra, thực tập sinh cịn giới thiệu cách thức làm việc công ty thời gian làm, quy định cần phải tuân thủ, cách sử dụng email công việc… Kết : Hiểu thêm cơng ty TISOHA, q trình thành lập phát triển Có thêm kỹ việc sử dụng email cơng việc, làm việc có kế hoạch, có kỷ luật, có trách nhiệm 2.2 Nghiên cứu kỹ thuật 2.2.1 Các công cụ làm việc Thời gian : tuần Nội dung : Tìm hiểu cơng cụ sử dụng q trình làm việc Trong thời gian này, cài đặt công cụ phục vụ cho công việc :AI Photoshop, visual studio code, visual studio, smart git Thực : Thực hành sử dụng phần mềm nêu Kết : Làm quen với công cụ 2.2.2 Đọc hiểu source code, fix bug giao Thời gian : ngày (1 tuần) Nội dung : Do dự án phát triển trước 1-2 tháng nên cần phải đọc source code fix bug nhỏ giao để hiểu tính năng, component team phát triển trước Thực : - Đọc code tiến hành fix bug giao Kết : - Hiểu dự án mà team phát triển Đinh Huỳnh Thái Bình 2.2.3 Thực project Sau tuần đọc hiểu source code fix bug nhỏ giao, nắm sơ dự án mà team phát triển, tiến hành nhận hoàn thành thành task theo print team Chi tiết công việc làm nói phần sau 2.2.4 Lịch làm việc Tháng 1,2 - - Mức độ Công việc Người hướng dẫn hồn thành Tìm hiểu cơng Anh Đỗ Công Bá 100% ty, cách tổ chức công ty Làm quen với công cụ làm việc công ty Đọc code, fix bug để hiểu dự án phát triển công ty Thực task Anh Đỗ Công Bá 100% theo Print team Nhận xét người hướng dẫn Đinh Huỳnh Thái Bình Chương 3: Các công việc làm 3.1 Xây dựng giao diện Mark Web Nội dung : Sử dụng thư viên Material UI để xây dưng giao diện giao figma Thực : - Sử dụng html,css để dựng giao diện - Custom component để xây dựng giao diện Kết : - Hoàn thành task với thiết kế designer 3.2 Xây dựng giao diện kết nối Api module quản lí Designer Admin Director Nội dung : Xây dựng giao diện theo thiết figma kết nối api cần thiết Thực : - Sử dụng Html, Css, Material UI để dựng giao diện - Sử dụng Redux để quản lý state giỏ hàng - Sử dụng useState để set state chuyển tab cửa hàng, thương hiệu, tự thiết kế - Sử dụng useEffect để xử lý ảnh hưởng bên cạnh ứng dụng - Sử dụng React slick cho slider Kết : - Hoàn thành task với thiết kế designer Đinh Huỳnh Thái Bình 10 3.3 Xây dựng giao diện kết nối Api module quản lí Normal User Nội dung : Xây dựng giao diện theo thiết figma kết nối api cần thiết Thực : - Sử dụng Html, Css, Material UI để dựng giao diện - Thiết kế form thêm, xóa, sửa người dùng - Sử dụng Redux để quản lý state giỏ hàng - Sử dụng useState để set state chuyển tab cửa hàng, thương hiệu, tự thiết kế - Sử dụng useEffect để xử lý ảnh hưởng bên cạnh ứng dụng - Sử dụng React slick cho slider Kết : - Hoàn thành task với thiết kế designer 3.4 Xây dựng giao diện kết nối Api module Business Profile Nội dung : Xây dựng giao diện theo thiết figma kết nối api cần thiết Thực : - Sử dụng Html, Css, Material UI để dựng giao diện - Sử dụng Redux để quản lý state giỏ hàng - Sử dụng useState để set state chuyển tab cửa hàng, thương hiệu, tự thiết kế - Sử dụng useEffect để xử lý ảnh hưởng bên cạnh ứng dụng - Sử dụng React slick cho slider Kết : - Hoàn thành task với thiết kế Business Profile Đinh Huỳnh Thái Bình 11 3.5 Một số chức khác xuất file PDF, xem file PDF trình duyệt, Upload File Nội dung: Xây dựng chức Upload File, PDF, Export PDF Thực : - Xử lí File gửi qua WebService để lưu trữ - Sử dụng Redux để quản lý state giỏ hàng - Sử dụng useState để set state chuyển tab cửa hàng, thương hiệu, tự thiết kế - Sử dụng useEffect để xử lý ảnh hưởng bên cạnh ứng dụng Kết : - Hoàn thành task 3.6 Một số hình ảnh giao diện ứng dụng Đinh Huỳnh Thái Bình 12 Đinh Huỳnh Thái Bình 13 Đinh Huỳnh Thái Bình 14 Đinh Huỳnh Thái Bình 15 Đinh Huỳnh Thái Bình 16 Đinh Huỳnh Thái Bình 17 Đinh Huỳnh Thái Bình 18 Đinh Huỳnh Thái Bình 19 Đinh Huỳnh Thái Bình 20 Đinh Huỳnh Thái Bình ... mại, quảng cáo, giáo dục, Ngành lập trình Web sinh nhu cầu truy cập, tìm kiếm thơng tin nhu cầu khác.Vì lý này, em định chọn lập trình web làm định hướng cho việc học tập Sau ba năm học tập trường,... kinh nghiệm thực tế, muốn tham gia làm lập trình web mơi trường chuyên nghiệp, em có dự định thực tập Vì vậy, em định chọn TISOHA - môi trường lý tưởng, đại, chuyên nghiệp - nơi giúp em thực dự định... mềm TISOHA tạo điều kiện cho em có hội thực tập công ty Chỉ thời gian ngắn, nhờ dẫn nhiệt tình, em tiếp thu kiến thức kinh nghiệm quan trọng lập trình font- end Reactjs Đặc biệt cảm ơn anh Đỗ Công