Code ứng dụng di động siêu dễ trong 15 phút với JavaScript và React-Native
ฝัง
- เผยแพร่เมื่อ 30 ก.ค. 2024
- 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: 096.577.6812
- Email: contact@codefresher.vn
- 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 - วิทยาศาสตร์และเทคโนโลยี
![แล้วแต่เวรแต่กรรม-ครูศรีหนุ่ม [OFFICIAL MV]](http://i.ytimg.com/vi/Xide0fkAS8g/mqdefault.jpg)
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
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
Anh ơi Anh dạy cách tối hưu hóa hiệu năng React native đi ạ
@@boongb2106 hi, em inbox page fb.com/CodeFresherVN để trung tâm tư vấn thêm nhe :D
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
$
clip rất hay và bổ ích ! cám ơn anh Hoàng nha !
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.
Clip đáng giá từng second. Thanks Hoàng!
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 .
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 !!!
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?
Video chất từng giây, like ra nhiều video như vầy đi
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.
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 ạ
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 ạ!
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ĩ
Quá giỏi luôn Hoàng ơi
Nhìn cái đống đồ chơi chất lượng quá Hoàng ơi
Video rất bổ ích, thank anh. Mấy ông dislike chắc quay ngược điện thoại để xem video :)))
Anh hoàng đẹp trai , quá giỏi quá tài năng, idol của em
Vid này đỉnh quá anh ơi
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) ?
Ô 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ỉ?
Thanks kiu a, vid kiểu này hay quá ạ nhưng phải để 0.75 xem =)))
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
Để 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 ạ
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é
@ e cx quan tâm ạ, mong a hoặc a aholic làm về java back end ạ
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 .
Mô phật ! xem clip của bác mình phải chỉnh tốc độ chậm lại mớ nghe được @@
sao để cái màu bên cạnh mã hex r chọn đc màu trog đó như trên video v a
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é
@ Quan tâm luôn nha a :)
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 ?
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.
Anh có thể chia sẻ cách nói lưu loát và hài hước như a vs ạ
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é th-cam.com/video/nUJcue1dQdc/w-d-xo.html
Hay quá anh ơi
Dạ anh ơi, reactjs nên sử dụng javascipt hay Typescript để nhắc lệnh tốt hơn ạ
Typescript đi e
Hay quá anh ạ
Ý tưởng app này hay quá anh
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 =))
Chất như nước cất
đườ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á..
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 ^^
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
Dung thu vien gi de lay duoc tan so nhi og
Source code a để đâu z a ,a nói nhanh quá em nghe không được đoạn đấy😢
A ơi, a có thể code cái app nào giúp đọc sách dk ko ạ
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 :((
Em giỏi quá ❤️👍
Bác có nhận dạy học trò về lập trình k ah
Anh ơi, anh làm bài hướng dẫn test tự động trên RN đi anh
Anh ơi , Anh dùng gì mà code nhanh thế ạ . có dùng phím tắt gì không ạ
Hay quá anh ơi
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.
ban tim ra cach chua b chi minh vs
a hướng dẫn customize "oh my posh " như cái terminal của a đi ạ
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
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
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.
Rất hay ạ
Nhìn anh code thích vchuong =))
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.
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)
Chọn ngành công nghệ thông tin -> chuyên ngành kỹ sư phần mềm.
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
Khi nào anh đi thi rap việt vậy anh
twist nhanh hon Tez
Hâhha
Em là Siêu tài năng !
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 ạ
Bạn biết chưa :)😢 cần t nói k
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/
cám ơn Hoàng
học lập trình vi điểu khiển thì bắt đầu từ đâu ạ. mong anh trả lời giúp ạ
dễ nhất là bắt đầu từ arduino nhé
lên mạng search học điều khiển arduino là được
Trên win mở cdm cài y vậy hả a trai
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
hoàn toàn ok nhé,
Background rất bổ ích
Anh em cho mình xin tên Theme VS Code trong video với
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
Hacker thì bên mảng an ninh mạng rồi
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
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
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
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 .
em có thể nói chậm lại chút nữa thì tuyệt vời
4:30 em ko "yarn wed " đc anh ạ
Làm sao để mở phần để code ạ
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
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. 😂
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.
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.
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 !!
mình hay coi anh này ở tốc độ 0.75 nên cũng ok
@@henrybui3386 lần đầu t coi TH-cam mà phải chỉnh tốc 0.75. Mà có phải cảnh phim hành động ảo diệu gì đâu 😅
Bạn oi có file apk rồi code nó chạy trên ios dc không
Anh cho em hỏi sao em không viết được css trong file như anh vậy ạ dù em đã import styled rồi
bạn chú ý là sau (View) là dấu ` sát số 1 không phải dấu nháy đơn nha :v
@@sontrananh9731 mình cũng bị tương tự, đã gõ ` như trong video rồi
sourc code ở đâu vậy anh em tìm hoài mà k thấy :'
Nên xài máy tính gì để học code tốt nhất ạ :)
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
sao e k vào đc githup của a vậy ạ?
Làm sao để lấy mã QR build app lên điện thoại vậy anh?
Bạn tìm đc hướng dẫn làm chưa ạ☺️share mình zới
Làm cái app đặt xe hiển thị giá tiền có bản đồ…. như taxi Mai Linh, Gojek, Vinasun… có khó và mắc không ạ
Khó và mắc lắm e
vậy làm cách nào để kiếm gấu cái vậy anh
cái github lấy ở đâu v ạ
làm sao để update expo để link với điện thoại vậy a, nó cứ báo phiên bản cũ trong cmd
xun link
không biết anh có thể chỉ cách tạo ra 1 app không nhỉ ???
Anh ơi cho em xin source code được không ạ?
anh ơi sao em cài React Navigation về mà cứ bị lỗi ạ
cài yarn install sao ko đc vậy bác
code copy tren github khong su dung duoc nua anh oi
Hello a
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
Nhập môn lập trình 😉,xg qua lập trình hướng đối tượng
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é
Cho e hỏi là cái theme terminal a đang dùng là theme nào thế ạ
a dùng theme Dracula em
a config hay cài thêm cái gì để cái folder path nó thành block color như trong video thế ạ
ông này dễ thương vãi
Anh ơi , cho em hỏi dự án Arduino đổi màu led bằng giọng nói của anh sử dụng module wifi để truyền dữ liệu cho arduino hả anh. Em cảm ơn
P/s : Thấy con led đổi màu theo giọng nói em mê quá mà tìm trên mạng chỉ có điều khiển tắt mở .
À nếu nhiều bạn quan tâm a sẽ làm hướng dẫn nhé
@ Thanks anh 🥰
@ .làm đi ah
@@UserBeltalowda làm đi a oi
@ like
Nhờ anh bonus cho em vài đường kiến thức để sửa lỗi khi PushToken ạ.
Em code như hướng dẫn nhưng không nhận được Token khi "Bấm lấy mã" trên điện thoại ạ!(IOS)
Em cũng có copy code ở vài video hướng dẫn Push Notifications khác nhưng vẫn không được, em bất lực lắm đành hỏi anh vậy :((((
( e không dính lỗi cú pháp)
Xem log xem nó lỗi gì thôi e
@ log ko hiện lỗi, e "bấm lấy mã" không hiện mã cũng ko hiện lỗi gì ra, expo trên đt vẫn chạy bình thường đó a :((
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
@ Có chứ nè :)
@ Có nè anh - hướng dẫn deploy nữa ạ
HAY TUYỆT
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
anh ơi, trước có 1 video anh giới thiệu project dùng tiếng nói điều khiển đèn trên 1 cái arduino, a biết công nghệ nào dùng được cho react native làm được real time như vậy không anh :3
E tìm hiểu socket.io nhé
@ lần đấy anh dùng thư viện gì để nhận dạng giọng nói vậy ạ
Các bạn nên chỉnh tốc độ video xuống 0.75 or 0.50 để nghe nhé
Tốc độ nói như này có quá nhanh đâu