Code ứng dụng di động siêu dễ trong 15 phút với JavaScript và React-Native

Hôm nay, tụi mình sẽ cùng code một ứng dụng di động (mobile app) siêu nhanh trong 15 phút nha. Chúng ta sẽ code một ứng dụng chạy được trên cả iOS lẫn Android, chỉ cần sử dụng JavaScript và React-Native là xong.
Ứng dụng này có UI xinh xắn đơn giản, lại hỗ trợ Notification để thông báo nữa nha.
Link đăng kí khoá học React-Native và Flutter: bit.ly/codedao-codefresher
Liên hệ tư vấn khoá học và lộ trình tại: CodeFresherVN
CodeFresher Việt Nam
- Địa chỉ: Số 104 Hoàng Ngân, Trung Hoà, Cầu Giấy, Hà Nội
- Điện thoại: [phone]
- Email: [e-mail]
- Website: codefresher.vn
Nhớ subscribe cho mình nhe: bit.ly/codedaotube
Timestamp
00:00 Giới thiệu vlog
00:15 Demo app di động triệu hồi gấu
01:35 Những thứ cần cài trước khi code
02:20 Giới thiệu sơ React-Native
04:00 Lấy code về và bắt đầu code
12:30 Code xong giao diện, bắt đầu code logic
19:30 Test app và kết thúc
Channel Tôi Đi Code Dạo là nơi mình chia sẻ những kiến thức, kinh nghiệm về ngành lập trình mà mình đạt được trong quá trình làm việc. Những kiến thức này sẽ biến các bạn từ một coder trở thành developer - lập trình viên thứ thiệt.
Nhớ ghé thăm và subscribe channel để xem clip mới vào 8H TỐI T3 hàng tuần nha!
Ghé thăm mình tại:
Blog: toidicodedao.com/
Fanpage: / toidicodedao
#code_cung_code_dao #react_native #mobile_app

Mình có viết 1 cuốn sách mang tên Code Dạo Kí Sự - Lập trình viên không phải chỉ biết code. Sách có nhiều nội dung khá hay và bổ ích cho anh em lập trình viên. Các bạn quan tâm có thể vào book.toidicodedao.com để đọc thử và mua ebook nha :3

[@boongb2106]

Tư vấn em chi tiết khoá học online đc ko ạ. Lộ trình, thời gian biểu, yêu cầu ...

share sources ko bạn ơi

[@mybuddy11]

Anh ơi Anh dạy cách tối hưu hóa hiệu năng React native đi ạ

[@CodeFresherVN]

@@boongb2106 hi, em inbox page fb.com/CodeFresherVN để trung tâm tư vấn thêm nhe :D

[@thangnguyen-co2vw]

em xin chào mọi người ạ . em mới bắt đầu học react native nên hiện đang học mở một project nhưng lại gặp lỗi như sau mong mọi người hướng dẫn sửa lỗi giúp em ạ . em xin cảm ơn ( nếu có video về lỗi này thì càng hay ạ) Admin@DESKTOP-JFVG2SH MINGW64 ~/Documents/Projects/helloworld $ npx react-native run-android info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag. Jetifier found 903 file(s) to forward-jetify. Using 8 workers... info Starting JS server... * daemon not running; starting now at tcp:5037 * daemon started successfully info Launching emulator... error Failed to launch emulator. Reason: No emulators found as an output of `emulator -list-avds`. warn Please launch an emulator manually or connect a device. Otherwise app may fail to launch. info Installing the app... Starting a Gradle Daemon, 1 incompatible and 1 stopped Daemons could not be reused, use --status for details > Task :app:installDebug FAILED 29 actionable tasks: 2 executed, 27 up-to-date FAILURE: Build failed with an exception. * What went wrong: Execution failed for task ':app:installDebug'. > com.android.builder.testing.api.DeviceException: No connected devices! * Try: Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights. * Get more help at help.gradle.org BUILD FAILED in 25s error Failed to install the app. Make sure you have an Android emulator running or a device connected. Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081 FAILURE: Build failed with an exception. * What went wrong: Execution failed for task ':app:installDebug'. > com.android.builder.testing.api.DeviceException: No connected devices! * Try: Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights. * Get more help at help.gradle.org BUILD FAILED in 25s at makeError (C:\Users\Admin\Documents\Projects\helloworld ode_modules\execa\index.js:174:9) at C:\Users\Admin\Documents\Projects\helloworld ode_modules\execa\index.js:278:16 at processTicksAndRejections (internal/process/task_queues.js:93:5) at async runOnAllDevices (C:\Users\Admin\Documents\Projects\helloworld ode_modules\@react-native-community\cli-platform-android\build\commands unAndroid unOnAllDevices.js:94:5) at async Command.handleAction (C:\Users\Admin\Documents\Projects\helloworld ode_modules eact-native ode_modules\@react-native-community\cli\build\index.js:186:9) info Run CLI with --verbose flag for more details. Admin@DESKTOP-JFVG2SH MINGW64 ~/Documents/Projects/helloworld $

[@NhanNguyen-mz9js]

Clip đáng giá từng second. Thanks Hoàng!

[@musclecatnana]

clip rất hay và bổ ích ! cám ơn anh Hoàng nha !

[@HuyNguyen-xp4ro]

nay chất lượng hình ảnh screen cải thiện nhiều rồi đó bác, ra thêm video như này đi bác, Thanks !!!

[@kentiiisociu]

Rất dễ thương rất rõ ràng truyền tải thông tin tốt. Cảm ơn bạn rất nhiều.

[@zimusic5226]

Video chất từng giây, like ra nhiều video như vầy đi

[@haunguyeninh5228]

Video rất bổ ích, thank anh. Mấy ông dislike chắc quay ngược điện thoại để xem video :)))

[@tinycorner0110]

Quá giỏi luôn Hoàng ơi

[@bachle7081]

Vid này đỉnh quá anh ơi

[@satako888]

Nhìn cái đống đồ chơi chất lượng quá Hoàng ơi

[@MsownO]

Anh hoàng đẹp trai , quá giỏi quá tài năng, idol của em

[@kimnamnguyen9013]

Thanks kiu a, vid kiểu này hay quá ạ nhưng phải để 0.75 xem =)))

[@tandung4736]

Rất hay. Bạn mà làm từng ứng dụng nhỏ kiểu như này thực sự rất dễ hiểu luôn. nhưng mà nói chậm một tí lại chắc ổn hơn @@

Bạn có thể chỉnh tốc độ 0.75 nhen

[@minhtringuyen242]

Hay quá anh ạ

[@lanhhana9402]

Hay quá anh ơi

[@thongnguyenanh9218]

Mô phật ! xem clip của bác mình phải chỉnh tốc độ chậm lại mớ nghe được @@

[@QuaNhanhCodingMusic]

Chất như nước cất

[@phuchoang-co3ei]

Làm sao để gắn ID cho text giống ở HTML vậy anh ? Em có kết nối với Readtime Database ở Firebase nhưng em chỉ in được ra console thôi ạ, em không biết cách gắn ID để xuất giá trị cho Text. Em cảm ơn .

[@COTUONGHAY.]

Em giỏi quá ❤️👍

[@micaelbao]

Ý tưởng app này hay quá anh

[@huynguyenquang2110]

Rất hay ạ

[@loia5tqd001]

App hay đó a, làm tới bến rồi release cho mấy em học sinh cấp 3 sài đi a.

[@sangluu4903]

Anh cho em hỏi là anh dùng PushToken của expo như vầy thì deploy ra app thật thì nó giử qua App expo hay App mình deploy ạ!

[@loutruong8000]

HI a sẵn đang làm app thì a cho e hỏi cái firebase sẽ giùp ích gì cho ng làm app cũng như những ng làm mkt a nhĩ

[@nguyennhatviet1150]

Cực thích video kĩ thuật kiểu này luôn!!!! anh làm thêm về web back-end được không ạ?!!

À nếu nhiều bạn quan tâm a sẽ làm nhé

[@nguyenconghuy3847]

@ e cx quan tâm ạ, mong a hoặc a aholic làm về java back end ạ

[@tuaasntp163]

Nhìn anh code thích vchuong =))

[@longnguyenhoang7129]

Em rất thích xem video của anh. Anh có thể đưa video giới thiệu và code data science được không .Thấy anh làm ứng dụng, phần mềm nhiều quá nên hơi chán. Ví dụ anh làm mô hình tương lai đi hoặc mô phỏng nhân tạo các thí nghiệm ....thì sao em nghĩ cũng học được nhiều điều.

E xem vlog này nhé kzbin.info/www/bejne/pIatlKibZsmEmsU

[@ptdong]

Này có thể sử dụng camera gắn ngoài qua cổng USB (endoscope camera) và áp dụng YOLO vào project được không A?

[@tuanvutran1421]

may là em này thành lập trình viên. Chứ thành giáo viên là VN lại có thêm 1 tiến sĩ gây mê nữa rồi =))

[@hieuphamhong4470]

Anh có thể chia sẻ cách nói lưu loát và hài hước như a vs ạ

[@giangnguyentanhoang5226]

hay quá anh , em hiện đang là du học sinh bên nhật và mới thi vào trường về IT hiện tại thật sự ở trường em không học được bao nhiêu cả vì dạy quá chậm . em đang tự học trên w3schools nhưng mà học theo tutorial thì em lại dễ bị mất hứng thú khi chưa biết cái mùi website nó ntn cả . a có thể giới thiệu giúp em cách học thú vị mà hiệu quả không ạ . Tks anh nhiều .

[@COTUONGHAY.]

Em là Siêu tài năng !

[@thengodpbot7892]

Ô anh ơi react-native này có chạy trên cái app chơi game như kiểu bluestacks hay LDPlayer ko nhỉ?

[@nathanngo8024]

Hay quá anh ơi

[@namdang540]

Great video! Cam on anh. Em thich video kieu nay lam. A lam 1 video ve back-end web duoc khong?

À nếu nhiều bạn quan tâm a sẽ làm nhé

[@cetruonghai]

@ Quan tâm luôn nha a :)

[@nguyentiencanh6715]

Bác có nhận dạy học trò về lập trình k ah

[@GiangHuyTV]

Cảm ơn anh vì video rất là hay lun ạ, nhưng mà source code ở đâu mọi người nhỉ, em tìm không thấy :((

[@namuwu]

anh ơi cho em hỏi tại sao lúc mà code thì trên expo lấy được token cho gấu cái mà lúc build ra thì bấm lấy mã thì không lấy được ạ

[@huytehat.37]

Hello a

[@kimphung8502]

ông này dễ thương vãi

[@HungBui-gu2wk]

Background rất bổ ích

[@HiepTran-tv1hh]

Anh ơi, anh làm bài hướng dẫn test tự động trên RN đi anh

[@thanhhuytruong31]

Anh ơi , Anh dùng gì mà code nhanh thế ạ . có dùng phím tắt gì không ạ

[@tienphanmemtinh8207]

Từ ví dụ này bạn có thể demo đọc, viết, lưu vào dữ liệu vào microsoft sql server thay vì lưu vào dữ liệu của máy chủ expo (theo mình hiểu dữ liệu bạn lưu vào expo có đúng không) ?

[@oquangtai3190]

Cho em hỏi, sau khi đăng nhập lại thì nó hiển thị lỗi ntn. thì fix ntn ạ Unhandled Rejection (Error): You must provide `notification.vapidPublicKey` in `app.json` to use push notifications on web.

[@HoangNguyen-ez1ek]

a hướng dẫn customize "oh my posh " như cái terminal của a đi ạ

[@tomkhovinhkimtravinh]

HAY TUYỆT

[@tienphanmemtinh8207]

expo go này cài máy ảo trên điện thoại, có phần mềm máy ảo chạy ổn định cài cho windows không anh ?

[@clone2nd]

Hay

[@minh5794]

hay thật đấy mn

[@kimidev]

Để cho web hiện trực tiếp như app thế thì làm sao anh. Cho em xin từ khóa hay anh làm video đc ko ạ

[@caubao]

Em chào a

[@phuongnamphan9368]

Dạ anh ơi, reactjs nên sử dụng javascipt hay Typescript để nhắc lệnh tốt hơn ạ

Typescript đi e

[@lehai4641]

A ơi, a có thể code cái app nào giúp đọc sách dk ko ạ

[@tunghoang8942]

Xét về trình độ thì anh này khỏi bàn. Đưa ra những lời khuyên rất hay, dựa trên trải nghiệm chứ không phải là chung chung, mỗi tội nghe anh nói thì đau đầu vãi chưởng.

[@henrybui3386]

anh nói hơi nhanh thì phải thật sự bắt nhịp không kịp nhưng a công nhận đưa ra lời khuyên và trình độ thì cao thủ rồi !!

[@henrybui3386]

mình hay coi anh này ở tốc độ 0.75 nên cũng ok

[@tunghoang8942]

@@henrybui3386 lần đầu t coi KZbin mà phải chỉnh tốc 0.75. Mà có phải cảnh phim hành động ảo diệu gì đâu 😅

[@kiennguyen6366]

em có thể nói chậm lại chút nữa thì tuyệt vời

[@chuyengiadigitalmarketing]

Hi anh, bên anh có nhận code app không anh? Em đang có 1 khách đang có nhu cầu code app á anh.

[@TheMaden3]

đỉnh zl =))

[@tranngochung4850]

Trên win mở cdm cài y vậy hả a trai

[@full7184]

Em xin chào anh. Em không có học lập trình. Nhưng anh cho em hỏi là windows 10 để hoàn thành nó thì cần bao nhiêu lập trình viên, và thời gian bao lâu vậy anh. Cảm ơn các video bổ ích từ anh. 😂

[@trontringuyen3109]

Cái này ko nói cụ thể đc bao nhiêu lập trình viên đâu bac, chỉ có thể nói là đội ngũ phát triển của MS đã hoàn thành bản Windows 10 và trong quá trình public sử dụng, sẽ tiếp tục tiếp nhận nhiều ý kiến phản hồi của người dùng, từ đó đưa ra giải pháp khắc phục, các bản vá, cập nhật để windows 10 tốt hơn.

[@minhthuanpham571]

sao để cái màu bên cạnh mã hex r chọn đc màu trog đó như trên video v a

[@hieulongnguyen5769]

Hi anh. Em có cái này muốn hỏi anh: khi em muốn cho một đối tượng (chẳng hạn một ảnh) phóng to và thu nhỏ theo nhịp điệu của tiếng nhạc trong web thì nên xử lý như nào ạ. Em cảm ơn anh đã đọc comment này ^^

[@khanhchung4103]

Mình không biết làm nhưng idea thì theo mình nghĩ nó như thế này: 1/ Đầu tiên là phải lấy được tần số lên xuống trong nhạc 2/ Dùng tần số đó để scale hình lớn nhỏ tùy theo ý của bạn

[@lifetime727]

Dung thu vien gi de lay duoc tan so nhi og

[@caotichcuc]

Quay tik tok giải thích công nghệ,tóm tắt các công nghệ cũ và mới đi ạ

À nếu nhiều bạn quan tâm a sẽ làm nhé

[@hanasakishuntaro2652]

Khi nào anh đi thi rap việt vậy anh

[@VuNguyen-sx4lt]

twist nhanh hon Tez

[@HUYPV0404]

Hâhha

[@mt5thucchienfx973]

bạn viết được code tự chơi game tài xĩu trên các sảnh game live casino không ? mình cần thuê người viết .

[@thekhoaday]

đường link source bài này ở đâu bạn, cho mình nhé.. mình cũng code theo bạn nhưng bạn chuyển màn hình nhanh quá, code này chắc để cho dân tương đối thạo nghề rồi, chứ mình dạng newbe nên code tóe tòe loe, thấy có kết nối nhưng toàn báo lỗi, nản quá..

[@datdev9266]

expo hiện tại không hỗ trợ SDK 40 nữa thì có cách nào nâng Version SDK của project lên cao hơn không v a? Rất mong nhận a hướng dẫn.

[@MonkeyDeath]

ban tim ra cach chua b chi minh vs

[@thaiaongoc6067]

Ảo quá :V

[@TienNguyen-ky4dx]

Flutter với React Native cái nào nên học hơn vậy sếp? mình đọc trên mạng thấy họ bảo app code bằng Flutter chạy nhanh hơn fai ko?

Bạn google “react native vs flutter” sẽ thấy bài phân tích nha :D

[@CodeFresherVN]

Hi, tùy team và cty yêu cầu bạn nha, 2 cái này performance cũng same same nhau thôi b :D

[@tienlx91]

Kinh nghiệm mình là từ Web qua thì nên học React Native vì như làm HTML, CSS, JS. Còn Flutter thì cấu trúc các Widget lồng nhau sẽ hơi rối xíu với 1 cái nữa là Flutter không có hỗ trợ codepush update OTA (over the air) tức là bấm 1 phát update app liền ngay và luôn khỏi cần publish lên store đợi reviews.

[@lehongphong4984]

Source code a để đâu z a ,a nói nhanh quá em nghe không được đoạn đấy😢

[@tranhuy517]

thôi thôi em xin, ccó fb là khổ lắm rồim, giờ thêm cái này khác nào vẽ đường cho hưu chạy

[@nguyenquangminh8616]

anh ơi em muốn học viết phần mềm thì theo học nghành kỹ sư phần mềm, công nghệ thông tin hay khoa nào khác ở đại học vậy ạ (em năm nay lớp 11)

[@tienphamhoang5359]

Chọn ngành công nghệ thông tin -> chuyên ngành kỹ sư phần mềm.

[@thamtu6412]

hay qúa nhưng phải học tù đầu mới được, chứ copy và paste code thì không biết mấy ký hiệu viết như thế nào hết. Source code của app download ở đâu vậy bạn

[@quoccuongpham3041]

Anh ơi! Anh học Công nghệ thông tin ở Đại học FPT nhưng chuyên ngành gì vậy. Em muốn làm lập trình viên (coder) mà không biết nên học chuyên ngành gì. Và em khá thắc mắc giữa kỹ thuật phần mềm và an toàn thông tin. Em muốn hiểu thêm về hacker sẽ học gì hay học gì để đề phòng hacker

[@kennavi2120]

Hacker thì bên mảng an ninh mạng rồi

[@hiderrmark4019]

may e girls kia dc qua

[@anhtho7613]

Cho e hỏi e học toán tốt tiếng anh tạm ổn lập trình e k biết thì liệu e có học đc k ạ Năm nay e 2k3

[@chaienoto]

hoàn toàn ok nhé,

[@chungmichio2916]

Anh làm video rất hay nhưng mong anh nói chậm chút ạ. Em nghe k kịp luôn ạ

Em có thể chỉnh tốc độ 0.75 nhen

[@d.i.yelectronic8592]

học lập trình vi điểu khiển thì bắt đầu từ đâu ạ. mong anh trả lời giúp ạ

[@chaienoto]

dễ nhất là bắt đầu từ arduino nhé lên mạng search học điều khiển arduino là được

[@pangolinkhoi1262]

anh ơi bạn nam xài iOS, bạn nữ xài Android thì có sử dụng được app không ạ? Phải cùng hệ điều hành mới được ạ?

Android vẫn đc e

[@ngahoang6311]

Theo a thì giờ học java có ổn k ạ tại e tính học cao đẳng ftp ý mà có hai nghành đạo tạo toàn dùng java

[@CodeFresherVN]

java vẫn rất ổn bạn à, ngôn ngữ lâu năm nhưng bây giờ doanh nghiệp vẫn sử dụng và phát triển rất nhiều, open job lương cao ko sợ thiếu việc đâu :D

[@ngahoang6311]

Vâng tại vì thấy nó có độ an toàn cao ý , doanh nghiệp dùng nhiều lắm , cảm ơn anh đã tư vấn

[@babymouse6714]

A đi thacha thức danh hài đi a

[@hiephoang5259]

hi cám ơn clip hướng dẫn của bạn. Mình muốn hỏi là code xong như vậy rồi, thì làm sao build ra 2 file cài trên android và ios

bạn dùng expo build là được nhé docs.expo.dev/classic/building-standalone-apps/

[@hiephoang5259]

cám ơn Hoàng

[@quynguyenxuan6764]

Các bạn nên chỉnh tốc độ video xuống 0.75 or 0.50 để nghe nhé

[@vicmaker]

Tốc độ nói như này có quá nhanh đâu

[@taolao2907]

Tiết là không có gấu để xài 😂

[@zulee8403]

Rap Code số 1 VN 🥲

[@chungmichio2916]

Làm sao để mở phần để code ạ

[@KLTDDo]

Bạn oi có file apk rồi code nó chạy trên ios dc không

[@banhquyet6919]

A thử hách toll sunwin đi

[@ucanhvuhuy5062]

cái github lấy ở đâu v ạ

[@cheems6763]

không biết anh có thể chỉ cách tạo ra 1 app không nhỉ ???

[@leonardoat9489]

A nên hướng dẫn thêm cách build ra app hoàn chỉnh luôn ạ

nếu nhìu bạn quan tâm a sẽ làm nhé :D

[@cetruonghai]

@ Có chứ nè :)

[@phuongnamphan9368]

@ Có nè anh - hướng dẫn deploy nữa ạ

[@irii5310]

nếu viết trên Win thgi dùng phần mền nào để code vậy a. mong anh trả lời ạ

[@CodeMetech]

Bạn biết chưa :)😢 cần t nói k

[@thonguyen7999]

1 gấu cái nhiều mã số gấu đực :))

[@ncduong]

Cayyy =))))

[@vannam4400]

mình phải để 0.75 mới kịp :v

[@phuongnamphan9368]

Nên xài máy tính gì để học code tốt nhất ạ :)

[@CodeFresherVN]

Hi, em tham khảo bài viết này về vde lựa chọn laptop để học và làm lập trình nhe: facebook.com/CodeFresherVN/posts/340655267392416

[@phongvu5747]

App này nhìn quen thế nhỉ

[@canhovan4429]

a chơi thử flutter đe

[@dophuocthien3573]

Anh em cho mình xin tên Theme VS Code trong video với

[@ha_nguyen_146]

Chú nói chậm chậm hộ con với ạ

[@wolfmanyn2854]

A gấu ơi e chưa biết j về code hết e muốn học z phải bắt đầu từ đâu a

[@thienbuiquang6453]

Nhập môn lập trình 😉,xg qua lập trình hướng đối tượng