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 ĐA NỀN TẢNG TRÊN THIẾT BỊ DI ĐỘNG Công ty thực tập : TNHH BAP VENTURES Người phụ trách : Nguyễn Tuấn Sơn Thực tập sinh : Nguyễn Lê Chấn Nam TP Hồ Chí Minh, tháng năm 2020 LỜI MỞ ĐẦU Ngày nay, ngành nghề liên quan tới công nghệ thông tin ngày phát triển mạng mẽ để bắt kịp với xu hướng chung Trong đó, Lập trình đa tảng thiết bị di động trở nên phổ biến Cùng với xu phát triển giới, Việt Nam ngoại lệ Ngành lập trình thiết bị di động non trẻ Việt Nam phát triển mạnh mẽ, để hòa nhập với công ty hàng đầu ứng dụng giới Bên cạnh công ty trẻ tuổi nước, công ty lớn giới gia nhập vào thị trường Việt Nam, góp phần lớn vào phát triển tích cực ngành di động Việt Nam Ngành lập trình thiết bị di động sinh nhu cầu giải trí giới trẻ thiết bị công nghệ Và giới trẻ nguồn nhân lực quan trọng cho việc phát triển ngành sau Vì lý này, em định chọn lập trình đa tảng thiết bị di động 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 ứng dụng di động môi trường chuyên nghiệp, em có dự định thực tập hè Vì vậy, em định chọn Cơng ty TNHH BAP VENTURES - môi trường lý tưởng, đại, chuyên nghiệp - nơi giúp em thực dự định LỜI CẢM ƠN Trân trọng gửi lời cảm ơn Công ty TNHH BAP VENTURES Việt Nam 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 nhóm trainer, nhóm thực tập chúng em tiếp thu kiến thức quan trọng để làm ứng dụng di động Chân thành cảm ơn anh chị nhóm trainer bỏ nhiều thời gian,cơng sức để hướng dẫn chúng em hồn thành đợt thực tập Đặc biệt cảm ơn anh Nguyễn Tuấn Sơn training React Native + Javascript, hướng dẫn, giúp đỡ cho em tận tình khó khăn cơng việc, đến khó khăn việc làm quen với môi trường mới, dẫn chúng em cách làm báo cáo, lên kế hoạch, kỹ thiếu 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 Em xin chân thành cảm ơn ! Nguyễn Lê Chấn Nam Thành phố Hồ Chí Minh, 27 tháng năm 2020 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 Giới thiệu công ty TNHH BAP AVENTURES Sản phẩm công ty Chương 2: Nội dung thực tập Tìm hiểu cơng ty kỹ công ty Nghiên cứu kỹ thuật 2.1 2.2 2.3 Các công cụ làm việc Tìm hiểu Framework React Naitve + Javascript nâng cao Lập trình ứng dụng di động đa tảng với React Naitve 10 Thực project 11 Chương 3: Chi tiết project 12 Giới thiệu ứng dụng 12 Thách thức 12 Giao diện ứng dụng 13 Thực 22 Kết qủa 22 TÀI LIỆU THAM KHẢO 23 TỔNG KẾT 24 Chương 1: Giới thiêu công ty thực tập Giới thiệu công ty TNHH BAP AVENTURES BAP AVENTURES thành lập năm 2016 Nhật bản, công ty OutSourcing Sau bốn năm thành lập, đến BAP khẳng định vị công ty dẫn đầu lĩnh vực phát triển phần mềm, tư vấn công nghệ, đầu tư cơng nghệ BAP có văn phịng đặt Nhật bản, văn phịng Việt Nam gồm có: Huế, Đà Nẵng, Hồ Chí Minh có hệ thống nhân viên với 244 nhân viên Sản phẩm công ty BAP làm đa tảng công nghệ có ngành cơng nghệ thơng tin nay: Về lĩnh vực AI: Smart OCR, SmartFashion, Smart E-learning, Keiba, Smart Anime Các sản phẩm từ công ty BAP: Tube maze, 2048 color 3D, Pitch the Disc, Happy scratch, Bomber man 3D, Print shop 3D, Locksmith 3D, Chocolate maker 3D,… Ứng dụng thực tế chứng khoán giao dịch tiền tệ: BAP Coin, BTC giao dịch, Smart Trading, Trình quản lý tài sản tiền tệ, Giao dịch tiền điện tử, Smart funding,… Chương 2: Nội dung thực tập Đợt thực tập với chủ đề “Lập trình đa tảng thiết bị di động” nhằm mục đích giúp sinh viên thực tập đào tạo toàn diện lập trình ứng dụng di động, đồng thời rèn luyện kỹ mềm làm việc nhóm, thuyết trình, giao tiếp Tại cơng ty, sinh viên có hội học tập, khám phá làm việc môi trường phát triển ứng dụng di động chuyên nghiệp 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 BAP VENTURES, 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 Nghiên cứu kỹ thuật 2.1 Các công cụ làm việc Thời gian : ngày Nội dung : Tìm hiểu công cụ sử dụng trình làm việc Trong thời gian này, anh hướng dẫn thực tập sinh tìm hiểu cơng cụ giúp ích cho cơng việc sau Một số phần mềm số Tortoise SVN - sử dụng làm việc nhóm, Git – cơng cụ quản lý source code trực quan với nhiều tính năng, Visual Studio Code - chương trình soạn thảo văn hữu ích phổ biến với lập trình viên Thực : Thực hành sử dụng phần mềm nêu Kết : Lập trình sử dụng cơng cụ miễn phí, giúp dễ dàng kết hợp công cụ với nhau, so với việc dung IDE 2.2 Tìm hiểu Framework React Naitve + Javascript nâng cao Thời gian : ngày (1 tuần) Nội dung : Được training kỹ thuật React Native + Javascript nâng cao, kiến thức quan trọng cho việc tối ưu ứng dụng di động - Work flow: Flow ứng dụng di động phần quan trọng lập trình, người dùng cần phải sử dụng ứng dụng với hiệu tốt nhất, ứng dụng chạy trơn tru, không bị crash hay gây lỗi sử dụng - React navigation : Là phần quản lý hình sử dụng nhiều lập trình đa tảng thiết bị di động sử dụng framework React Native, tạo liên kết hình với ứng dụng cho liền mạch khơng bị lỗi navigate hình với ứng dụng - React Hook : Viết tất component, chức ứng dụng hoàn toàn function, không dùng class component, tạo việc dễ dàng quản lý thành phần chức ứng dụng, viết service cách nhanh hơn, xử lý bất đồng ứng dụng nhanh chóng - Redux Mobx: Là phần dùng để quản lý state app Giúp cho quản lý ứng dụng tốt nhất, state chung toàn ứng dụng xứ lý hai package - Javascript: Học cách xử lý bất đồng bộ, kiến thức javascipt, cách tạo biến, mảng, state,… Thực : - Tham gia đầy đủ buổi training công ty - Làm thực hành, kiểm tra kiến thức học Kết : - Nâng cao kỹ lập trình với Framework React Naitve + Javascript - Có kiến thức quan trọng cho việc lập trình đa tảng ứng dụng di động sau - Ngồi cịn biết thêm số quy tắc việc viết code cho chuẩn, dễ đọc, dễ hiểu 2.3 Lập trình ứng dụng di động đa tảng với React Naitve Nội dung: Các kiến thức React Native để làm ứng dụng di động - Khái niệm React Native Nắm khái niệm React native, framework cho ứng dụng di động Được phát triển Facebook Nó sử dụng để phát triển ứng dụng di động đa tảng Ngoài ra, trainer cung cấp cho em khái niệm cách tạo function component, sử dụng React Native CLI, cách xử lý state nội màng hình thơng qua việc sử dụng React Hook,… - Cách viết styles React Native Nó tương đồng với Css việc viết hiệu ứng giao diện cho ứng dụng di động - Jquery Học cách dùng jQuery: thư viện phổ biến mà đa số lập trình viên sử dụng vào để xử lý module dùng để gọi API nhận hay truyển liệu cho bên back-end, xử lý thuộc tính đối tượng hình ứng dụng di động, xử lý kiện người dùng - Một số package hữu dụng Được anh trainer giới thiệu cho package hỗ trợ cho việc lập trình UI ứng dụng, dùng package tiết kiệm bớt thời gian lập trình cho module cần thiết, mã nguồn mở nên React Native có lượng Package phong phú Github Một số package hữu ích sử dụng ứng dụng thực tập: React-native-scrollable-tabsview, Styled-component, React-native-elements, React-navigation, Redux, Redux-Thunk, Mobx Thực : - Tham gia đầy đủ buổi trainning - Làm tập thực hành vẽ hình bản, state management ứng dụng di động - Tìm kiếm tài liệu mạng để tìm hiểu them, tìm hiểu flow ứng dụng di đông cho hoạt động trơn tru Kết : - Hiểu khái niệm lập trình ứng dụng di động React Native Thực project Sau tháng training thực hành, thực tập sinh nắm kiến thực React Naitve, Javascript Trong tháng thứ hai, trainer hướng dẫn thực tập sinh áp dụng kiến thức học để thực ứng dụng thực tế công ty Chi tiết đồ án nói phần sau Chương 3: Chi tiết project Giới thiệu ứng dụng SMART FASHION Trên ứng dụng, người dùng sử dụng phịng thay đồ ảo để thử quần áo, họ tự tạo phong cách riêng từ tủ đồ với chức phối đồ ứng dụng, SMART Fashion chấm điểm trang phục tạo người dùng Đây giải pháp để tiết kiệm thời gian nâng cao trải nghiệm khách hàng thương mại điện tử, hay cửa hàng thời trang Cơng nghệ máy học góp phần việc phát triển ứng dụng này, khách hàng cảm nhận thật với sản phẩm quần áo Đây xem ứng dụng tốt đội ngũ BAP Thách thức Con người bận rộn, họ đơi chí khơng có thời gian để mua sắm nhu yếu phẩm Nói cách khác, nhà bán lẻ thời trang đối mặt với giỏ hàng mua sắm trống không nhắc đến mua sắm online hàng đống hàng đỏi trả khơng kích cỡ hay có vấn đề màu sắc Smart Fashion ứng dụng sử dụng công nghệ AI mà BAP xây dụng để giúp nhà bán lẻ giải đề với chức thử đồ ảo tự động phối đồ với quần áo có sẵn tủ đồ người dùng Giao diện ứng dụng Phần giao diện đăng nhập đăng kí Phần welcome Phần Forgot Password Phần Event: : Phần QR: Phần Product Information: Phần Try on: Thực thành viên team React Native: - Nguyễn Tuấn Sơn - Đỗ Văn Tuân - Và giúp đỡ tận tình team trainer Bap Kết qủa - Hầu hết tính thực - Hỗ trợ thêm phần chức Events, News - Ứng dụng mắt AppleStore Chplay TÀI LIỆU THAM KHẢO For React Native https://reactnative.dev/ For React Navigation https://reactnavigation.org/docs/getting-started/ For React Hook https://reactjs.org/docs/hooks-intro.html For Redux https://redux.js.org/ https://github.com/reduxjs/redux-thunk For Mobx https://mobx.js.org/README.html For JSX https://reactjs.org/docs/introducing-jsx.html TỔNG KẾT Sau đợt thực tập khoảng hai tháng công ty, em kịp hoàn thành phần giao diện cho ứng dụng Smart Fashion công ty, chạy đa tảng như: Ios, Android, IpadOS Ứng dụng Smart Fashion có chức thay thử quần áo sử dụng công nghệ AI Developer bên công ty phát triển, ứng dụng em hoàn thành thực tập thêm số chức phần News ( cập nhật thông tin, tin tức cửa hàng, hay mặt hàng thời trang…), phần Event ( kiện thời trang xảy xảy cập nhật ứng dụng để người dùng theo dõi tham gia kiện) Qua đó, em xin chân thành cảm ơn giúp đỡ anh chị đội ngũ trainer công ty, giúp đỡ em hồn thành tập doanh nghiệp cách tốt học hỏi nhiều kinh nghiệm quý báu để sau áp dụng công việc tương lai  ... Smart funding,… Chương 2: Nội dung thực tập Đợt thực tập với chủ đề ? ?Lập trình đa tảng thiết bị di động? ?? nhằm mục đích giúp sinh viên thực tập đào tạo tồn di? ??n lập trình ứng dụng di động, đồng... kịp với xu hướng chung Trong đó, Lập trình đa tảng thiết bị di động trở nên phổ biến Cùng với xu phát triển giới, Việt Nam ngoại lệ Ngành lập trình thiết bị di động non trẻ Việt Nam phát triển... này, em định chọn lập trình đa tảng thiết bị di động 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 ứng dụng di động mơi trường