Styling React Native Components: The Fundamentals of Stylesheet

Sdílet
Vložit
  • čas přidán 31. 01. 2023
  • Welcome to a youtube channel dedicated to programming and coding related tutorials. We talk about tech, write code, discuss about cloud and devops. That’s what we do all day, all year. We roll out a lot of series and videos on our channel.
    All the learning resources such as code files, documentations, articles and community discussions are available on our website:
    chaicode.com/
    You can find our discord link, github link etc on the above website.
    Twitter/X link: x.com/hiteshdotcom
    Discord link: hitesh.ai/discord
    Learn React with 10 projects: • Let's learn react from...
    Learn Docker: • A practical guide on D...
    Learn Kubernetes: • Complete Kubernetes Co...
    How does a browser works: • How does a browser wor...
    How nodejs works: • How node JS works | En...
    Learn Redux-toolkit: • Learn Redux Toolkit in...
    Learn NextJS: • Nextjs Full stack course
    Learn Typescript: • Why to learn Typescript
    Learn Javascript: • Welcome to new JavaScr...
    Learn React Native: • React Native Mastery: ...
    Learn Zustand: • React state management...
    Learn Golang: • How to get started wit...
  • Věda a technologie

Komentáře • 81

  • @nishan456singh
    @nishan456singh Před 11 měsíci +26

    You just gave enthusiasm for comeback in Coding after 5 years, been driving truck. Have no words!
    Thanks Hitesh!
    Regards
    Nishan

  • @DeepuSingh
    @DeepuSingh Před rokem +7

    Everyone is just demanding something extra from you but I want to thank you for this amazing playlist thanks a lot

  • @vishalthakur8102
    @vishalthakur8102 Před rokem +2

    Everybody plz share the playlist, this type of content must be promoted. Thankyou hitesh sir❤

  • @gurpreetkapoor8993
    @gurpreetkapoor8993 Před rokem +12

    By default react native has flex-direction as column instead of row as in web. This is mentioned in react native docs. That's why align-items and justify-content behave as opposite to web.

  • @shivamjha.56
    @shivamjha.56 Před rokem +15

    can u give us a glimpse of which 10 apps we are gonna build in this series

    • @mma-dost
      @mma-dost Před rokem +1

      yeah that would be great sir please show us the apps we are gonna build during this course.

  • @guddubhaiyathikanamirzapur4079

    Your videos are easily understandable...Even if I have to pay something for these kinds of lectures, I will happily do it.

  • @iqbalhussaincs9998
    @iqbalhussaincs9998 Před rokem +1

    Thank you sir, waiting for next video.

  • @virinchibalusani5726
    @virinchibalusani5726 Před 3 měsíci

    Thanks buddy
    Great job Hashnode💜

  • @baanuaali2818
    @baanuaali2818 Před 10 měsíci

    Thank you so much sir. This video helps me alot, you're the best teacher ever!!!

  • @aniketjha5946
    @aniketjha5946 Před rokem +1

    thank you thank you thank you sir 🥳🥳 for this series 🥳🥳

  • @moeen007
    @moeen007 Před rokem

    Love this series!

  • @Vaibhaaaav__
    @Vaibhaaaav__ Před rokem +2

    Hi Hitesh, i'm still looking forward to your next video !!
    When will it be uploaded on you tube ??

  • @asmakamaal1258
    @asmakamaal1258 Před rokem

    Thank you so much Sir for this...😊🌼

  • @ranjanrnj6864
    @ranjanrnj6864 Před rokem

    Great Content, Thank you Sir

  • @priyagarg6844
    @priyagarg6844 Před 4 měsíci

    Thanks a log bro for such wonderful knowledge free of cost

  • @SSC__CLASSES
    @SSC__CLASSES Před měsícem +2

    if using safe area view then use style container on it not on view element

  • @rahul191jain
    @rahul191jain Před rokem +3

    Without using style sheet also we can return Javascript object with styles. So what is use case of Stylesheet?

  • @saurav7052
    @saurav7052 Před rokem +6

    Sir can you please put your react native course into a Playlist so it would be helpful to get them on one go

  • @techsonaniya8923
    @techsonaniya8923 Před rokem

    Very good teaching skills

  • @runmenon
    @runmenon Před rokem

    Can we inspect the style like a web app?

  • @kpofcochin
    @kpofcochin Před měsícem

    can someone help me to enable the autosuggest/ autocomplete in the editor? In my IDE I dont see the options when I press JSX. or for any item as it shown in the video.

  • @abhinandvp5289
    @abhinandvp5289 Před rokem +1

    Waiting for next video..

  • @sriharshas3889
    @sriharshas3889 Před rokem +1

    Sir please upload react native videos daily :)

  • @amritrai367
    @amritrai367 Před rokem +1

    Video on open source repo setup on codespace
    Sir, I & many other students are facing problems regarding backend setup in codespace. It is easy to make a new express mongodb project on codespace but how to setup an open source express repo on codespace is very hard & i am facing many issues which are not there in local setup like 502 gateway nginx.
    Please make a video showing an open source express mongo repo setup on codespace

  • @sagarbharati1438
    @sagarbharati1438 Před rokem +2

    hi. can you update when the next vdyo will out? we are waiting brother

    • @HiteshChoudharydotcom
      @HiteshChoudharydotcom  Před rokem +2

      I update things on discord and instagram. I will try to post more here in youtube community too. 🙂

  • @VishalKumar-fz4vn
    @VishalKumar-fz4vn Před rokem +1

    sir, we are waiting for the upload of the next video
    please upload it🙏

  • @abhishekpatil5768
    @abhishekpatil5768 Před rokem +1

    Sir when is today's video going to come??

  • @Powerasp
    @Powerasp Před 8 měsíci

    started following your react native tutorial, one problem i am getting is the dark mode isnt getting on no matter how much i try

  • @NehaGupta-zc3mo
    @NehaGupta-zc3mo Před 3 měsíci

    Thank you for the series. I am first time learning React Native and it's very easier to understand. Thanks @hashnode @hitesh

  • @Coder_DhruvArora
    @Coder_DhruvArora Před rokem +1

    When the next video sir? Please

  • @Aditya.Santra
    @Aditya.Santra Před rokem +1

    Amazing...

  • @hatimtekri4949
    @hatimtekri4949 Před rokem +1

    Please upload next video for react native

  • @abdu5822
    @abdu5822 Před rokem +3

    i hope you'll teach us Redux in React Native

    • @HiteshChoudharydotcom
      @HiteshChoudharydotcom  Před rokem +9

      Depends on people, if they share the content and shows interest. 🙂

    • @mma-dost
      @mma-dost Před rokem +1

      @@HiteshChoudharydotcom please sir without that how we will make big complex apps

    • @adharshd493
      @adharshd493 Před rokem

      @@HiteshChoudharydotcom we need it..

  • @prasadpatil2371
    @prasadpatil2371 Před 10 měsíci

    is there source code available for practice. please shere link, Your video content is very helpful, Thank you!!!

  • @saieashwar870
    @saieashwar870 Před rokem +3

    It's not necessary to use StyleSheet anymore. Just a normal object would suffice

  • @muhammadarsalanmanzoor3938

    whats next is it end?

  • @plexitechsolutions4280

    sir can you make a video on how to debug the react native app.

  • @shivanagula123
    @shivanagula123 Před rokem

    What's your opinion on CHATGPT?

  • @DREAM-dg8sh
    @DREAM-dg8sh Před rokem +1

    Sir you forgot to upload next video

  • @Ishan-Choudhary
    @Ishan-Choudhary Před 5 měsíci

    13:22 it did for me lmaoo [also with align-items center, my Hello World just becomes Hello any fix to that?]

  • @jiilaal
    @jiilaal Před rokem

    Thank you

  • @tanvighildiyal8068
    @tanvighildiyal8068 Před rokem

    Nice Video, I heard maruti suzuki is hiring through a case study competition called XCELerate. It is for both E-School & B-School students. It also has prizes of 7 lakh rupees. Can u make a video on it plss.

  • @wlqpqpqlqmwnhssisjw6055

    nice video

  • @debnath0702
    @debnath0702 Před 4 měsíci

    Thanks

  • @RohitYadav-iz2pk
    @RohitYadav-iz2pk Před měsícem

    don't know why but drak mode is not working for me. printed isDarkMode and it's saying false

  • @Vishnu-eo6dt
    @Vishnu-eo6dt Před rokem +1

    When adding flex:1 in stylesheet.container the app does not load the Text. without flex:1 I can see items with allignItems: 'center'. What is the purpose of flex:1. Can Anybody help with this?

  • @sagar-ko3gb
    @sagar-ko3gb Před 10 měsíci +1

    when i am using safe area veiw my styles are not applying.why?

    • @R3sponsiblE
      @R3sponsiblE Před 7 měsíci +2

      That because in iOS in the new update, you need to set the SafeAreaMode inside the View and now before it.
      Example:

      You can think about like You have a "div" that manage the contain object, and the SafeAreaMode is a command that apply all properties in it..
      and if you do SafeAreaMode outside View its apply this container its apply View also, and view is only a container - NOT THE OBJECT!

  • @udaym4204
    @udaym4204 Před rokem +1

    sir video material ui and also appwrite Thank you

  • @B-NikhilRichhariya
    @B-NikhilRichhariya Před 2 měsíci

    13:23 it worked for me, text changed to black

  • @numbnut
    @numbnut Před rokem

    Can't we use tailwind?

  • @ShivaniYadav-ut9is
    @ShivaniYadav-ut9is Před 8 měsíci

    how to download react native android app on mobile or tab

  • @pankajsuryavanshi8332

    When will u start microservice Nodejs?

  • @RudraprasadMohapatraa
    @RudraprasadMohapatraa Před 5 měsíci +1

    Increase the likes , how it can be less than 1k !

  • @OwnCreate
    @OwnCreate Před rokem

    Hello sir we need a new course Java, can you please sir start Java course as a beginner level 🙋🏻‍♂️🙏

  • @programmingholic
    @programmingholic Před rokem

    Done Sir,

  • @bintangaldian1769
    @bintangaldian1769 Před 9 měsíci

    how about funtion in StyleSheet?

  • @sahil.77600
    @sahil.77600 Před rokem +1

    New videos....?❓❓❓❓❓❓❓

  • @TechDecryptor
    @TechDecryptor Před 7 měsíci

    👌👌👌👌

  • @vipulm124
    @vipulm124 Před rokem +1

    Hi Sir,
    When is the next video releasing in this series?

  • @piyush-singhania
    @piyush-singhania Před rokem

    So far with you 🚗

  • @rishiraj2548
    @rishiraj2548 Před rokem

    🙏👍👍

  • @alexjuniortupapa
    @alexjuniortupapa Před 6 měsíci +1

    Excellent course, thanks for sharing,
    if you error, copy my solution:
    import React from 'react'
    import {
    View,
    Text,
    StyleSheet,
    useColorScheme
    } from 'react-native'
    function AppPro(): JSX.Element{
    const isDarkMode = useColorScheme() === 'dark'
    return(


    Hello World


    )
    }
    const styles = StyleSheet.create({
    container: {
    flex: 1,
    alignItems: 'center'
    },
    whiteText: {
    color: '#FFFFFF'
    },
    darkText: {
    color: '#000000'
    }
    })
    export default AppPro;

  • @wlqpqpqlqmwnhssisjw6055

    buce vue=dei

  • @ramasamynp8175
    @ramasamynp8175 Před rokem +1

    It seems that you are not sure what you are going teach.

  • @meritalok
    @meritalok Před 3 měsíci

    ooops not like that

  • @codebite590
    @codebite590 Před 5 měsíci

    You mistakenly gave white text on both dark and light mode!