- Видео 22
- Просмотров 31 952
LG Santiago
Добавлен 13 авг 2022
A Real Frontend Scenario: Using JavaScript's with() Method in React
In this video, we dive into the powerful with() method of JavaScript's Array and explore its practical use in a real-world React app scenario. We'll cover what the with() method does, how it works, and how to leverage it to efficiently replace elements within an array.
#javascript #reactdevelopment #programming #coding #webdevelopment
MDN: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/with
Code Repository: github.com/lgsantiago/emoji-selector
Timeline:
00:00 - Intro
00:14 - Example in the console
01:19 - React App Description
01:49 - React App Code
04:26 - Outro
#javascript #reactdevelopment #programming #coding #webdevelopment
MDN: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/with
Code Repository: github.com/lgsantiago/emoji-selector
Timeline:
00:00 - Intro
00:14 - Example in the console
01:19 - React App Description
01:49 - React App Code
04:26 - Outro
Просмотров: 221
Видео
Get Up and Running with Styled-Components
Просмотров 8410 месяцев назад
🚀 Dive into the world of styled-components with this hands-on tutorial! Whether you're new to React or looking to enhance your styling skills, this video is your go-to guide for transforming a basic HTML button into a dynamic, styled component. 🌟 In this tutorial, we'll start with a simple HTML button and migrate to a beautifully styled version using the styled-components library. Not only will...
User Registration Under 10 Minutes! Firebase Integration in React Native with Expo
Просмотров 94610 месяцев назад
In this tutorial I guide you through integrating Firebase into your React Native app using Expo, all in under 10 minutes! Perfect for beginners and intermediate developers alike, this video covers everything from installing Firebase to setting up user registration. Follow along as I navigate the Firebase console and show you how to seamlessly integrate it into your React Native application. #Re...
How to Autofocus Using the useRef Hook in React
Просмотров 42511 месяцев назад
In this video, I'll walk you through the step-by-step process of leveraging the useRef hook to autofocus on a DOM node in your React applications. Whether you're a beginner or an experienced developer, mastering this technique can significantly enhance user experience in your projects. #reactdevelopment #reactdeveloper #webdevelopment #useRefHook 🔍 What's in store for you: Understanding the use...
How to Remove Items from Arrays in Your State. Array Manipulation for Work and Interviews.
Просмотров 77Год назад
This video is a continuation of our previous video where we talked about adding items to an array in the local state. ruclips.net/video/aAS0VjtNzZM/видео.htmlsi=OfCaN45Af-MKO3dV In this video, you'll learn how to remove items from arrays in your local state with grace and ease. We'll teach you the best practices and walk you through the code step by step, so you can apply this knowledge to your...
How to Add Items to Arrays in Your State. Effortless Array Manipulation for Work and Interviews
Просмотров 150Год назад
Are you ready to level up your React skills and ace those work projects or job interviews? Arrays are like the bread and butter of your app's data, and knowing how to add items efficiently is a must. In this video, we're going to explore the most effective techniques to work with arrays, right within your React Native app. We're diving deep into the code to show you how it's done. Javascript Sp...
Boost Your React Native Development with AI: Creating a Mobile App with ChatGPT
Просмотров 3,8 тыс.Год назад
In this video, Luis takes you on a journey as he utilizes ChatGPT as a handy assistant to craft a brand-new mobile application using React Native. You'll get to see how he kicks off the application, generates the starter code, and effortlessly obtains test data with a little help from ChatGPT. This is just one of the numerous sources of inspiration you can tap into as you develop your software....
Build a React Native App with Expo Router: File-Based Routing
Просмотров 4,6 тыс.Год назад
In this video, I will walk you through creating a new React Native app using Expo Router. Expo Router allows you to effortlessly implement a file-based router in your application. We will be using the Link component from the expo-router library to enable seamless navigation between different sections. With Expo Router, files added to your app directory become a route, providing users a smooth a...
Exploring State Changes in React Native WebView
Просмотров 3,7 тыс.Год назад
Take your React Native skills to the next level with this latest video! In the last episode, we explored the WebView component from the react-native-webview library and now, we're going to add a prop that'll allow us to keep tabs on changes within the WebView. This opens up the opportunity to take control back to our React Native app and render other components. Join me as we explore one of the...
How To Render a Web View from React Native
Просмотров 4,9 тыс.Год назад
How To Render a Web View from React Native
Distribute iOS Apps to Simulators in 7 minutes with eas-cli (React Native and Expo)
Просмотров 1,7 тыс.2 года назад
Distribute iOS Apps to Simulators in 7 minutes with eas-cli (React Native and Expo)
How to detect first time app launch with Async Storage (React Native and Expo)
Просмотров 5 тыс.2 года назад
How to detect first time app launch with Async Storage (React Native and Expo)
Learn How to Start Working with CSS Grid
Просмотров 972 года назад
Learn How to Start Working with CSS Grid
Create, Test & Debug a React Native App Using Expo
Просмотров 4,4 тыс.2 года назад
Create, Test & Debug a React Native App Using Expo
How to get out this as a real time app I mean how to convert this as an app
great work! clean
Please make a playlist like beginners to expert with taking assistance with AI. nobody on youtube is doing this, the course will be short and nice. this video covers a lot though.
nice.error.debugging
thanks mate, help my day
Can we use react native cli and expo router?
can i access the value of a input box from the webview?
Would you please share the source code of this React Native program? Thanks
Can u share the SignUpform ?
after passing the handleSignup to the signup form as a props what i have to do. I am getting confuse
good tutorial source code
great video if anyone wants a signup components here it is // SignUp.js import React, { useState } from 'react'; import { View, Text, TextInput, Button, StyleSheet } from 'react-native'; const SignUp = ({ onSignUp }) => { const [email, setEmail] = useState(''); const [password, setPassword] = useState(''); const handleSignUpPress = () => { onSignUp(email, password); }; return ( <View style={styles.container}> <Text style={styles.title}>Sign Up</Text> <TextInput style={styles.input} placeholder="Email" onChangeText={(text) => setEmail(text)} value={email} /> <TextInput style={styles.input} placeholder="Password" secureTextEntry onChangeText={(text) => setPassword(text)} value={password} /> <Button title="Sign Up" onPress={handleSignUpPress} /> </View> ); }; const styles = StyleSheet.create({ container: { width: '80%', maxWidth: 400, alignItems: 'center', }, title: { fontSize: 24, marginBottom: 16, }, input: { height: 40, width: '100%', borderColor: 'gray', borderWidth: 1, marginBottom: 16, padding: 8, }, }); export default SignUp;
Good tutorial brother👍
I am glad you enjoyed it. Thanks for watching!
I am getting this error 'view config getter callback for component rncwebview must be function' any idea?
God bless you
ty so much man 😀!!! you helped me alot
I am glad this video helped! Thank you for watching 🙏
Thank u for helping us
I am glad this video helped you. Thanks for watching!
Came across this video, didn't know it was a react native. I'm new to it. Nice content 🔥
I am glad you like the content! Thanks for the feedback
Amazing content 👏🏼
Great summary of the process! I also like that you at the end summarized the steps you did in the video. So we get the overview. Very pedagogical. :)
Thank you for your feedback. I am happy you enjoyed the video
😄 *promo sm*
Helping you to reach 💯 subscribers congratulations 🎉🎈🎊🍾 😄
you did not write a test.😒
it's so surprising that this guy's channel is that much underrated even after providing that much value to us developers, keep it up bro you are so close 😄🤗
Thank you so much! I am glad you’re enjoying the content
Excuse-me sir, why do we need to pass the Image component in a function? I got an issue : by doing that, the image doesn't show in the child component, even if I don't put it in an arrow function...do you have an idea on why the image is not display in the child component please. I precise that the image come from a backend "Sanity", but I don't see the problem cause it display very well in the parent component, only when I want to pass it in the child component, I can't receive it. I need a help please.
Thank you so much ! As a beginner in React native, i really struggled to use expo router, and you were very clear :)
I am glad this video was helpful!
Thank you sir🎉
Can I test it on my iphone?
you will need expo go to done that
Thanks, mate. 🎉
Greate work mate. The documentation in webview is not very elaborate so your content is really helpful. Thank you a lot
Glad it was helpful!
Thank you bro!
Thankyou so much 😊🎉❤
You're welcome 😊
thats really nice !
Thanks!
hey brother awesome video thank you for this, i was wondering if you could make a video and take this a little further take the webview and whenever a user clicks on a link or a certain link containing /api for example it takes that link and it opens it in a different webview that receives that link and gets rendered in a separate stack screen, i think a video doing this would amazing is also a question i have been asking myself for months now cant figure it out!!
perfect, I really didnt find one video in portuguese, for luck I fell in your video, and you save me. Nice video!!!
Glad I could help!
Nice vid!
Great Demo!
Platform looks great. Excellent presentation 👏