(Tiểu luận) báo cáothực tập tốt nghiệp đơn vị công ty tnhh fpt software

HỌC VIỆN CƠNG NGHỆ BƯU CHÍNH VIỄN THƠNG KHOA CƠNG NGHỆ THÔNG TIN BÁO CÁO THỰC TẬP TỐT NGHIỆP Đơn vị: CÔNG TY TNHH FPT SOFTWARE Giảng viên hướng dẫn: ĐÀO NGỌC PHONG Sinh viên thực hiện: PHAN HOÀNG NGUYÊN Mã sinh viên: B19DCCN480 Lớp: D19CNPM08 Hà Nội - 2023 LỜI MỞ ĐẦU Trong trình thực tập công ty TNHH Phần mềm FPT thực nhiệm vụ học tập nhà trường đợt thực tập tốt nghiệp, đồng ý ban lãnh đạo Khoa đào tạo bám sát đề cương Khoa công ty đưa ra, với lý luận kiến thức học Trong trình thực tập em trau dồi thêm kiến thức Lập trình Web Front-end cấu tình hình hoạt động cơng ty thực tế Được tận tình giúp đỡ hướng dẫn cơng ty TNHH Phần mềm FPT cụ thể chị Linh, anh Trường chị Mai với giúp đỡ giáo viên hướng dẫn thầy Nguyễn Văn Tiến thầy Nguyễn Hải Dũng nỗ lực học tập, tìm tịi học hỏi, em hồn thành báo cáo thực tập tốt nghiệp Báo cáo gồm phần chính: - Phần I: Giới thiệu chung đơn vị thực tập - Phần II: Quá trình thực tập công ty - Phần III: Kết luận trình thực tập Trong trình thực báo cáo, cố gắng em hạn chế thời gian tìm hiểu, kiến thức kinh nghiệm cịn nhiều sai sót Em mong nhận ý kiến đóng góp nhận xét thầy Nguyễn Văn Tiến để em hoàn thiện LỜI CẢM ƠN Để hoàn thành báo cáo thực tập tốt nghiệp em xin cảm ơn tới phía ban lãnh đạo cơng ty TNHH Phần mềm FPT tạo điều kiện cho em thực tập Ngoài ra, em cảm ơn thầy Nguyễn Văn Tiến thầy Nguyễn Hải Dũng ln nhiệt tình dẫn, giảng dạy cho em kiến thức cần có việc thực tập cơng ty thực tế để em hồn thiện Em xin gửi lời cảm ơn tới ban lãnh đạo Học viện, Khoa đào tạo thiết lập khung chương trình có mơn học “Thực tập tốt nghiệp” để em vận dụng kiến thức học giảng đường áp dụng vào công việc tham quan, tìm hiểu mơi trường doanh nghiệp Em xin gửi lời cảm ơn sâu sắc chân thành tới giảng viên hướng dẫn thầy Nguyễn Văn Tiến thầy Nguyễn Hải Dũng Nhờ thầy ln dìu dắt, giúp đỡ bảo tận tình cho em để hoàn thành tốt Thực tập tốt nghiệp Em xin chân thành cảm ơn! NHẬN XÉT KẾT CỦA ĐƠN VỊ THỰC TẬP Hà Nội, ngày … tháng … năm 2023 Quản lý lớp NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN Hà Nội, ngày … tháng … năm 2023 Giảng viên hướng dẫn MỤC LỤC LỜI MỞ ĐẦU LỜI CẢM ƠN NHẬN XÉT KẾT CỦA ĐƠN VỊ THỰC TẬP NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN MỤC LỤC PHẦN I: GIỚI THIỆU CHUNG VỀ ĐƠN VỊ THỰC TẬP CHƯƠNG I: TỔNG QUAN VỀ ĐƠN VỊ THỰC TẬP Giới thiệu đơn vị thực tập Khái quát chung công ty CHƯƠNG II: NỘI DUNG THỰC TẬP Nội dung khóa đào tạo Campuslink Front-end Developer Lịch trình đào tạo .9 PHẦN II: QUÁ TRÌNH THỰC TẬP TẠI CÔNG TY 10 CHƯƠNG I: TỔNG QUAN CÁC NỘI DUNG ĐÀO TẠO 10 Soft skills online 10 Front-end Development Overview 10 HTML 11 CSS 14 Javascript 20 CSS Framework: Bootstrap 22 JavaScript Advanced 23 CHƯƠNG II: KẾT QUẢ CÁC BÀI TẬP ĐÃ LÀM 27 Kết kiểm tra HTML, CSS 27 Kết tập kiểm tra JavaScript 28 PHẦN III: KẾT LUẬN QUÁ TRÌNH THỰC TẬP .30 Kinh nghiệm rút sau trình thực tập .30 Hạn chế trình thực tập 30 Kết đạt sau trình học tập đơn vị thực tập 30 TÀI LIỆU THAM KHẢO 31 Document continues below Discover more from: Tập Tốt Thực Nghiệp Học viện Công ng… 13 documents Go to course 14 44 52 10 114 HinhThuc trinhbay TTTN-QD-922-… Thực Tập Tốt Nghiệp None Báo Cáo Thực Tập Tốt Nghiệp Tại Côn… Thực Tập Tốt Nghiệp None D19AT Nguyen Nhat Thai BCDK2 Thực Tập Tốt Nghiệp None LE THI MINH Trang BAI BAO d9yji Thực Tập Tốt Nghiệp None Bao cao - 80 - 0150 Nguyễn Ngô Hồng… Thực Tập Tốt Nghiệp None Bao cao - 03 - 0132 Trương Công Minh PHẦN I: GIỚI THIỆU CHUNG VỀ ĐƠN VỊ THỰC TẬP CHƯƠNG I: TỔNG QUAN VỀ ĐƠN110 VỊ THỰC TẬP Thực Tập Tốt Giới thiệu đơn vị thực tập Nghiệp None - Tên đơn vị: Công ty TNHH Phần mềm FPT (FPT Software) - Địa chỉ: FPT Building, No.17 Duy Tan Street, Cau Giay District, Hanoi, Vietnam Khái quát chung công ty FPT Software, a global technology and IT services provider headquartered in Vietnam, operates as a subsidiary of FPT Corporation, a prominent ICT Group in Asia Benefiting from decades of experience in the global market, FPT Software has positioned itself as a catalyst for digital transformation across diverse industries With its roots in Asia's leading ICT Group, FPT Corporation, FPT Software has leveraged its extensive expertise to empower businesses worldwide The company's reach spans multiple sectors, including Healthcare, BFSI, Manufacturing and Automotive, Communications, Media and Services, Aerospace and Aviation, Logistics and Transportation, Utilities and Energy, Consumer Packaged Goods, and the Public Sector This broad spectrum of industry engagement underscores FPT Software's prowess in addressing the unique challenges and opportunities presented by various fields CHƯƠNG II: NỘI DUNG THỰC TẬP Sau trải qua tháng học tập làm việc công ty Em học nhiều kiến thức Lập trình Web Front-end Nội dung khóa đào tạo Campuslink Front-end Developer - Thời gian thực tập đơn vị từ: 03/07/2023 – 16/08/2023 - Thời gian làm việc học tập: từ thứ đến thứ - Hình thức khóa đào tạo Campuslink Front-end Developer: ● Học tập làm việc Tầng 9, tòa nhà FPT Building, số 17 Duy Tân, Cầu Giấy, Hà Nội: Thứ thứ ○ Sáng: 8h45 - 11h30 ○ Chiều: 13h15 - 17h30 (Tự học) ● Học tập làm việc online qua Microsoft Teams: Các ngày lại tuần ○ Sáng: 8h45 - 12h30 ○ Chiều: 13h45 - 17h30 (Tự học) - Nội dung khóa đào tạo Campuslink Front-end Developer FPT Software Lịch trình đào tạo Lịch trình học tập cơng ty lên lịch theo tuần học Theo thời gian thực tập Học viên cụ thể gồm tuần Nội dung học tập tuần: + Outer Display cách phần tử tổng thể hiển thị trang Điều ảnh hưởng đến cách phần tử tương tác với phần tử khác - Box model CSS: Mô hình hộp CSS (CSS Box Model) mơ tả cách mà phần tử tổ chức chiếm không gian trang Nó bao gồm thành phần: nội dung, padding, border margin - Lề (Margin), khoảng đệm (Padding) viền (Border) ba thành phần quan trọng mơ hình hộp Margin tạo khoảng cách phần tử, padding tạo khoảng cách nội dung viền, border viền xung quanh phần tử - Sử dụng display: inline-block: display: inline-block kiểu hiển thị cho phép phần tử có tính chất khối ơn tập nội dịng Phần tử hiển thị dịng ơn tập nội dịng chứa thuộc tính khối padding border e Overflow CSS - Overflow CSS gì? Overflow CSS đề cập đến tình nội dung phần tử vượt kích thước xác định cho Điều xảy nội dung lớn khơng gian có sẵn phần tử - Thuộc tính overflow CSS cung cấp khả kiểm soát cách hiển thị nội dung tràn kích thước phần tử Nó có số giá trị như: visible, hidden, scroll, auto, overlay f Values Units - Giá trị CSS: Trong CSS, giá trị phần thông tin xác định cách áp dụng thuộc tính cho phần tử Các giá trị số, từ khóa, màu sắc loại liệu khác xác định đặc điểm kiểu phần tử Ví dụ: thuộc tính font-size: 16px;, giá trị "16px", định kích thước phông chữ văn - Đơn vị khoảng cách: Đơn vị khoảng cách CSS sử dụng để đo độ dài, kích thước khoảng cách phần tử Các đơn vị khoảng cách phổ biến bao gồm pixel (px), điểm (pt), centimet (cm), milimet (mm), inch (in) picas (pc) Các đơn vị cho phép bạn xác định phép đo xác cho thuộc tính khác chiều rộng, chiều cao, lề phần đệm - Tỷ lệ phần trăm (%) - Ems Rems: "Ems" "rems" đơn vị độ dài tương đối CSS "Em" liên quan đến kích thước phơng chữ thành phần đó, "rem" liên quan đến kích thước phơng chữ gốc tài liệu - Màu sắc: Màu sắc CSS sử dụng để xác định giao diện trực quan phần tử Màu sắc định nhiều định dạng khác nhau, bao gồm hệ thập lục phân (#RRGGBB #RGB), RGB (rgb(255, 0, 0)), RGBA (rgba(255, 0, 0, 0,5)), HSL (hsl(0, 100%, 50%)) HSLA (hsla(0, 100%, 50%, 17 0,5)) Màu sắc đóng vai trò quan trọng việc tạo thiết kế hấp dẫn trực quan truyền tải thông tin đến người dùng g Sizing item - Đặt Kích thước cụ thể: Trong q trình phát triển web, bạn đặt kích thước cụ thể cho phần tử nhiều đơn vị khác pixel (px), centimet (cm), milimet (mm), inch (in) điểm (pt) Đặt kích thước cụ thể đảm bảo thành phần chiếm lượng khơng gian cố định kích thước nội dung chế độ xem - Sử dụng tỷ lệ phần trăm: Sử dụng tỷ lệ phần trăm để định cỡ cho phép bạn làm cho phần tử phản hồi nhanh Khi bạn đặt chiều rộng chiều cao phần trăm, phần tử chia tỷ lệ dựa vùng chứa Chẳng hạn, bạn đặt chiều rộng: 50%; phần tử, chiếm nửa chiều rộng phần tử chứa - Tỷ lệ phần trăm Margin Padding: Tỷ lệ phần trăm tiện dụng để đặt lề phần đệm Áp dụng tỷ lệ phần trăm cho lề phần đệm cho phép khoảng cách phần tử tương vùng chứa Chẳng hạn, lề trên: 10%; tạo lề 10% chiều cao vùng chứa - Kích thước tối thiểu tối đa: CSS cung cấp thuộc tính chiều rộng tối thiểu, chiều cao tối thiểu, chiều rộng tối đa chiều cao tối đa để thiết lập ràng buộc kích thước phần tử chiều rộng tối thiểu chiều cao tối thiểu đảm bảo phần tử khơng nhỏ kích thước định Ngược lại, chiều rộng tối đa chiều cao tối đa hạn chế phần tử phát triển vượt kích thước - Đơn vị khung nhìn (vw, vh, vmin, vmax) đơn vị tương đối dựa kích thước khung nhìn (cửa sổ trình duyệt) Chúng cung cấp cách đáp ứng để định kích thước phần tử, chúng điều chỉnh linh hoạt với kích thước khung nhìn Ví dụ: chiều rộng: 50vw; đặt chiều rộng phần tử thành 50% chiều rộng khung nhìn h Background - Background Color - Background Image - Background Image Repeat - Background Image Size i Border - Border Width - Border Style 18 - Border Color - Border Radius j Styling image - width: Chỉ định chiều rộng hình ảnh - height: Chỉ định chiều cao hình ảnh - object-fit: Xác định cách hình ảnh phù hợp với vùng chứa - object-position: Đặt vị trí hình ảnh vùng chứa - filter: Áp dụng hiệu ứng hình ảnh cho hình ảnh, chẳng hạn độ mờ độ sáng - opacity: Điều chỉnh độ suốt hình ảnh - border: Xác định đường viền xung quanh hình ảnh - box-shadow: Thêm hiệu ứng đổ bóng cho hình ảnh k Styling text - font-family: Chỉ định phơng chữ sử dụng cho văn - font-size: Đặt kích thước ký tự văn - font-weight: Xác định độ dày ký tự văn - font-style: Áp dụng kiểu chữ nghiêng xiên cho văn - color: Xác định màu sắc văn - line-height: Điều chỉnh khoảng cách dòng văn - text-align: Đặt chỉnh văn vùng chứa - text-decoration: Thêm kiểu trang trí gạch chân gạch ngang văn - letter-spacing: Kiểm soát khoảng cách ký tự - word-spacing: Đặt khoảng cách từ - text-transform: Thay đổi cách viết hoa văn l CSS Layout - Float - Flex - Grid - Position - Responsive 19 Javascript a Tổng quan Javascript - JavaScript ngơn ngữ lập trình linh hoạt chủ yếu sử dụng để phát triển web Nó cho phép tương tác, nội dung động kịch phía máy khách b Variables - Biến lưu trữ giá trị liệu - Khai báo biến var, let, const - let const hỗ trợ khối phạm vi ({ }) c Numbers and Operators: - JavaScript hỗ trợ toán tử cộng (+), trừ (-), nhân (*), chia (/), modulo (%) - Các toán tử so sánh: >, =,