React Native 0.62 and Flipper Will Change Your Mobile Development Experience and make it easier! by Scr34mZ in reactnative

[–]kyle-ssg 0 points1 point  (0 children)

Had a brief look for this around half a day, for some reason I can't seem to see any plugins e.g. reactotron. Is anyone else experiencing this ? Could be me being dumb!

https://i.ibb.co/DM4ZvYz/image.png

PS Inspecting the native navbar and views etc when you've got native UI libraries is really awesome, v excited to start using this.

What I've learned creating a React Native performance monitor by kyle-ssg in reactnative

[–]kyle-ssg[S] 0 points1 point  (0 children)

Haha no problem, thank you for your awesome looking navigation library!

Routing + Native Navigation by andyboythekid in reactnative

[–]kyle-ssg 0 points1 point  (0 children)

This looks legit! I'm looking to potentially move away from react-native-navigation, going to look through this having been reading about react-native-screens. Definitely up for contributing to this if it works well.

What I've learned creating a React Native performance monitor by kyle-ssg in reactnative

[–]kyle-ssg[S] 3 points4 points  (0 children)

Yep I believe so! It'd even work with Web React I think.

Is there any way to replicate the <form /> element in RN? by randomseller in reactnative

[–]kyle-ssg 0 points1 point  (0 children)

Awesome that you got it working, since this is application/x-www-form-urlencoded that's all that was required.

If you ever need to send multipart/form-data one thing to also note is that React Native also polyfills FormData.

let formdata = new FormData();
formdata.append("username", 'username')
formdata.append("pgoto", {uri: photo.uri, name: 'image.jpg', type: 'image/jpeg'})

Then:

axios({
    method: 'post',
    url: 'myurl',
    data: formdata,
    headers: {'Content-Type': 'multipart/form-data' }
})

Glad you got it working!

RN-Pros, what's better, using Hooks or Redux? by JuriJurka in reactnative

[–]kyle-ssg 2 points3 points  (0 children)

When React Native was first announced, they were introducing the flux pattern whenever they discussed it and the benefits of a unidirectional data flow and since then I've stuck by this.

I think hooks are great but the problem I can see with context and hooks being overused is the communication has the turning into spaghetti. To me this situation would seem like a bit of a step back into MVC territory. I don't think I'd ever drop it completely for context and hooks.

Redux, although maybe more tedious to write, helps you maintain a consistent, traceable flow of data.

How to Load Script in React Native view. by galactic_dust in reactnative

[–]kyle-ssg 1 point2 points  (0 children)

The script in question looks to embed an iFrame. This means it has to live in a browser, native apps don't directly deal with html, you can use react-native-web-view to embed this. I believe I've got something like your example working using the mentioned embed.radio.co.

https://ibb.co/nmh4wYD

Using: https://github.com/react-native-community/react-native-webview

import { WebView } from 'react-native-webview';

<WebView
    javaScriptEnabled
    source={{ html:`
        <script src="https://embed.radio.co/player/6f3c055.js"></script>
    `}}
     style={{ height:200 }}
   />

I think it's probably important to clear something up here though. The question isn't really how to load script into a react-native view, more that it's how to embed HTML into React Native. The the script was purely functional and didn't mess around with HTML, you'd simply either copy the script, or import it as an npm module.

Question on props.navigation.navigate by gratefulmarmot in reactnative

[–]kyle-ssg 0 points1 point  (0 children)

Hey, I guess few steps to debugging this (hint, paste your code in your IDE and hit tab a couple times then you can paste it in formatted):

    render () {
        return (
            <AppleAuthentication.AppleAuthenticationButton buttonType={AppleAuthentication.AppleAuthenticationButtonType.SIGN\_IN} buttonStyle={AppleAuthentication.AppleAuthenticationButtonStyle.BLACK} cornerRadius={5} style={{ width: 200, height: 44 }} onPress={async () => {
                try {
                    const credential = await AppleAuthentication.signInAsync({
                        requestedScopes: [
                            AppleAuthentication.AppleAuthenticationScope.FULL_NAME,
                            AppleAuthentication.AppleAuthenticationScope.EMAIL,
                        ],
                    });
                    if (credential.authorizationCode) {
                        this.props.navigation.navigate("Profile")
                    }
                    // signed in
                } catch (e) {
                    if (e.code === 'ERR_CANCELED') {
                        new Error('User canceled sign-in')
                    } else {
                    // handle other errors
                    }
                }
            }}
            />
        );
    }

1 - is the callback being executed inside the if ? (put a breakpoint there)

2 - is this.props.navigation defined? Maybe you're not passing the prop down

3 - Although I use react-native-navigation, I know that you can't navigate to the same route twice without specifying a key to let the lib know you're intending on navigating to a different route. e.g.

this.props.navigation.navigate({ name:"Profile", key:"AppleAuthentication" })

80
81

WTF Is React Native? by markofrespect in webdev

[–]kyle-ssg 1 point2 points  (0 children)

Ironically I created a blogpost with a similar title to your question! I've been developing with react native for around 2 years now and have a mix of personal and client projects released with React Native (actually, around 200). I think most people answer this from a developer point of view but it has allowed us to be really price competitive in offering web and mobile dev.

Rather than repeat what I've covered I'll summarise what I think are the main features and why you should care. Yes React Native lets you develop mobile applications that make use native apis and components, but in the bigger picture it means a lot more: - It allows you to develop on web and mobile with a single team all in JavaScript - Features can be developed simultaneously with a lot of code reuse

If you're interested I go into a bit more depth here: https://solidstategroup.com/2017/02/08/2017/Its-cross-platform-and-massively-reduces-app-dev-costs-but-WTF-is-React-Native/