🔥 Great Expo template - Expo Router v3 & Nativewind v4

[@Baconbrix]

Great video! Really exciting to see how quickly you can fly through building an app with Router and Tailwind!

[@CatalinMironDev]

Is that simple. yes! I believe everyone should give it a try!

[@metythorn2776]

Do u think react native will dominate cross platform over flutter in future?

[@Baconbrix]

@@metythorn2776it already does on iOS and web.

[@vladgamfaleanu8294]

When trying the web i get an error "error: SyntaxError: \src\global.css: Bad character escape sequence. (1:32)". I can't find any solution to this. Any pointer to fix this?

[@TechHelpBD]

getting this ERROR Warning: You are setting the style { shadowOffset: ... } as a prop. You should nest it in a style object. E.g. { style: { shadowOffset: ... } }

[@colyndev]

Nice! Side note: I have to have my volume up to its max to be able to hear you.

[@trenthm]

wonderful. love the chill vibe... but you still seemed excited

[@fransis4448]

Always top quality, my friend!

[@CatalinMironDev]

Thank you Fransis!

[@ycdcherokee]

Finally you are back!

[@franckngoubounkou9930]

The monster Catalin miron 😊.You are the best

[@CatalinMironDev]

Thank you!

[@franckngoubounkou9930]

@@CatalinMironDev for nothing. Your animation it 's juste powerfull .

[@tamaniphiri]

Great stuff Catalin, great stuff indeed

[@CatalinMironDev]

Glad you enjoyed it!

[@alashish]

Great video my friend, i am learning a lot from your videos. Thanks man for this👍

[@bradpreston9872]

Such a great video! Thank you for this

[@CatalinMironDev]

Glad it was helpful!

[@CoryTheSimmons]

Day 48,529 of asking for Expo to make/maintain a headless UI kit so we don't have to rely on insanely buggy third party plugins that haven't been updated in 7 years to do basic UI stuff like popovers. Otherwise, I'm just sticking to web-only no matter what they come out with.

[@CatalinMironDev]

Well, 133 years its a little too much. There’s Tamagui which is pretty good for cross-platform UI and it’s pretty complete.

[@CoryTheSimmons]

@@CatalinMironDev I wasn't impressed by Tamagui, and I still desperately want Expo or Meta to fund someone, or a team, to make a headless UI kit identical to Zeego except with tons of components for iOS/Android/web (it's possible, I made a PoC. I also applied at Expo but they never replied so RIP). That said, I have reconsidered this Expo Router thing. The Expo team did a great job on this and it absolutely does interest me. 🤪I'll just manually style non-native components for stuff. At least then I can get some simple apps out the door.

[@Imsurethishasnotbeentaken]

The “there is tamagui is a bit too much overused”. Please show and example where you have used tamagui on a real project. Not just a few videos with a few screens here and there.

[@vishalbhati8974]

That looks really simple and amazing. But as a beginner I've always had issues with the environment setup be it Android or iOS or Web, if you find time can you please create a video where you show how to properly set up the environment for React native apps?

[@masoom-theproudvegan7212]

which extenstion you are using for autocomplete

[@jinger_5655]

king is back

[@CatalinMironDev]

I’ll give you my 👑. Thanks!

[@alexisscuderi196]

bro for some reason im using this comand (and i also tried several times to combine nativewind with expo router from scratch) but its not working for me, it always lands on a white screen and the app doesn't work

[@brukkassahun6723]

Amazing video! thank you for sharing,

[@dimitrihartt]

Can you please show us how to deploy this project on Aws Amplify?

[@tonyibra]

did u manage to get it done ?

[@RMReactive]

with-router-tailwind (Expo Router + Nativewind). "npm run start" stuck on "68.7% (400/498)". How to solve it?

[@DanAtWork1000]

If you're having trouble running it on web in windows: try $ npx expo install nativewind@4.0.25 .. then $ npx expo start --clear ... to clear the bundler cache

[@wailedparsley36]

@@DanAtWork1000 You are my savior. Thank you so much 🙏

[@0tiii]

--web is broken with this template as with most v4 installations of nativewind

[@mariolimaju]

Yes, still broken!

[@DanAtWork1000]

@@mariolimaju I wish I would have read this days ago. I spent the last 3 days trying to get it to work, thinking it was working for everyone else... Le sigh

[@24alvi]

How to do the theme animation using react state like useColorScheme

[@eyout7973]

welcome back

[@CatalinMironDev]

Thanks!

[@TechHelpBD]

getting this ERROR Warning: You are setting the style `{ shadowOffset: ... }` as a prop. You should nest it in a style object. E.g. `{ style: { shadowOffset: ... } }`

[@josephmyalla3611]

Hi, am getting the same warning myself, Did you get the solution

[@geraldmbahia]

the "shadow" class of "explore" link in Content is the cause, i think

[@dudeinthemirrorl587]

hey Catalin, great video, thank you! Just wondering how do you get autocomplete when editing app.json, any particular VSCode extension you are using, or IDE setting?

[@erkamd.1664]

github copilot imo

[@muhammadferdianiqbal9392]

Hi! Your video is awesome, but I have a problem when try to start the project. Error running TailwindCSS CLI, please run the CLI manually to see the error. Command used: jobpedia ode_modules\tailwindcss\lib\cli.js --input "jobpedia\src\global.css" --output "jobpedia ode_modules\.cache ativewind\global.css.native.css" --watch what should I do? thanks

[@TechHelpBD]

Hey I also faced this issue It is because of your project directory name. My project directory when I was getting the error: F:\Android Development\Projects\MyAwesomeApp My project directory when I solved this error: F:\Android\Projects\MyAwesomeApp so, yeah I changed the name from Android Development to Android only and that's it. It fixed my issue. Don't add space in your folder or filename.

[@danteariastarifa4297]

@@TechHelpBD thanks! it works

[@TechHelpBD]

@@danteariastarifa4297 Welcome bro

[@mustafazouari4961]

when i run command on mac it tells me Unknown arguments: -e

[@umitcelik5508]

Really really great video. But i wonder that nativewind is stable? Or product ready? If you can yes i wanna cry :D

[@owenwexler7214]

This template may get me off Ionic and onto Expo, especially if I can reuse Tailwind classes from my web app and keep the appearance as consistent as possible.

[@CatalinMironDev]

Mostly everything should be reusable.

[@chat-jpt]

What is your camera setup? I really like.

[@BerkanBuyuk]

Süpersin Şafak abi

[@CatalinMironDev]

Thank you!

[@umitcelik5508]

Şafak kim?

[@javascriptexpanse]

wow, damn this is cool

[@raikoo5714]

this is amazing

[@elsecoding8691]

You're the best 😊

[@CatalinMironDev]

Thank you very much!

[@mla3eb]

What is extensions you use for react native catalin?

[@CatalinMironDev]

What do you mean by extensions?

[@YunusCode]

Nice job! But I don't think Tailwind UI is good for mobile. )

[@CatalinMironDev]

Why do you think so? Ot’s not a UI components library that’s for sure, but having a cross-platform library that speeds up your development it’s great.

[@CatalinMironDev]

I think that Tamagui is more complete and you have lots of components/building block that help you code a UI design pretty easy and fast

[@YunusCode]

​@@CatalinMironDev Yes, Tamagui is pretty good. :)) Tailwind is the best css framework, we can use it with React native but we always try to follow Apple/Android ui/ux guidlines. Most people make android and iOS apple like web mobile version xDD

[@lerigogsadze5816]

VS Code theme name, please

[@CatalinMironDev]

Palenight Operator theme with `Dank Mono` font family

[@fernandovillalba3346]

rt

[@shiekhpalace2401]

@@fernandovillalba3346 But the Dan Mono is paid can you give it for free here

[@shiekhpalace2401]

​@@CatalinMironDev dank mono is not available for free can you please share the files of font here

[@umardev500]

RN artist

[@luka1790]

Github repo?

[@CatalinMironDev]

Here you go: github.com/expo/examples/tree/master/with-router-tailwind

[@jazzcafecoffee]

Do you take on projects ,,,,, Can we talk ?

[@4th_aeon]

My file paths is not working

[@sagarchauhan8460]

hi junior developer here recently worked on an project where had to choose react native project instead of expo bcaz of seniors. The reason they were telling were bcaz of firebase where it would not work without ejecting in expo. Can u explain about what ejecting is and do we really need to eject from expo for some featuers. thnx already liked the video👍

[@balogunakanbi6329]

Firebase already ships with a config plugin you can use in expo apps with dev client

[@chrisyohann]

Ejecting means "going out of the expo workflow", and manage separately iOS and Android bundles of your app. But as baloguna said, the `react-native-firebase` library includes an expo plugin that will inject the firebase configuration files (*.plist for IOS and .json for Android) directly in your bundle without having to eject your whole project

[@CatalinMironDev]

There's no term `eject` anymore. There's prebuild (docs.expo.dev/workflow/prebuild/)

[@Semih-nd3sq]

so, what did u teach?

[@marvelbabalola2461]

Great video Catalin. I am actually new to your channel. I tried using this approach with Npm on my windows 10 machine but I can’t open the application on web. It keeps bundling and it stops halfway(55%). I don’t know if there are any resources that might help or direct me in the right path. Or some clarity if I am making a mistake somewhere

[@usmanmarkaz]

sir why expo plz also make videos on react native CLI

[@kennethpole2736]

Great tutorial, how do you setup a custom locally fonts in the assets folder?

[@4th_aeon]

how do i add custom fonts please help

[@TamilLatest]

Glad to see you back bro

[@tsatsujnr]

What app do you use to quickly toggle dark/light mode for for the web and simulator

[@CatalinMironDev]

On macOS, you can press ⌘ + ⇧ + A when the simulator is focused, which will toggle the appearance. I hope this will help. I have added this comment in the video as well.

[@24alvi]

@@CatalinMironDev can the theme animation be done using react state like useColorScheme

[@princefred1357]

Great tutorials!

[@CatalinMironDev]

Glad you like them!

[@amanmittal416]

👏👏👏

[@CatalinMironDev]

Thanks Aman!