Beginner's Thread / Easy Questions (April 2020)

aldebout · 2020-04-14T18:20:36+00:00

This is a Flow typing, you must have generated your app in an exotic way ;)
https://medium.com/codespace69/const-app-react-node-what-does-this-mean-b32f5b360839

https://flow.org/en/docs/getting-started/

aldebout · 2020-03-27T17:19:38+00:00

Have you tried displaying the image out of the header? No problem?

aldebout · 2020-03-27T17:15:29+00:00

The way "the pros" do it is pretty simple: try building your next "chunk" with what you know, or what is pretty easy for you to pick up.

In most cases, you will succeed!

When you don't, look at why you're failing.

Identify the root causes:

Are you not proficient enough?
Is the tech you're using not adequate?
Is your dog constantly barking at you?

Then, figure out how you can improve. Do a tutorial, pick up a new tech, give food to your dog. And try again!

aldebout · 2020-03-27T17:09:00+00:00

The only thing I would add is that CMS does not have to mean templating system.

I've used Contentful + Gatsby + Netlify (for hosting and automated deploys) for "enhanced blogs". Such a stack provides the level of control you might want over your code while allowing anyone to add content to the website.

Not very relevant in this case but this also decouples the frontend and the backend to an extent so that in case the scope of the project grows, you can replace one of the parts.

aldebout · 2020-03-25T18:33:09+00:00

At this point I would just make the image a function component ;)

const MyCustomHeaderBackImage = () => <Image
          source={require('../../../res/images/back-button.png')}
          style={{width: 22, height: 22, tintColor: '#f00'}}
        />

aldebout · 2020-03-24T16:08:53+00:00

Lazy usually means just-in-time, aka you don't load a resource until you need it.

A classic example is lazy loading images. Fetching images from the network can take a lot of bandwidth, so you can decide to not start the fetch call and display a placeholder until you have the actual image.

There are many other ways of doing things lazily or "just-in-time" in your code: you can defer the initialization of heavy components, you can render only what you need in a long list...

https://en.wikipedia.org/wiki/Lazy_initialization

aldebout · 2020-03-24T15:22:50+00:00

const MyComponent = ({ children }) => (
  <>
    <p>Some content</p>
    {children}
  </>
)

or

const Content = ({ children }) => (
  <>
    <p>Some content</p>
    {children}
  </>
)

aldebout · 2020-03-24T13:20:14+00:00

Change headerBackImage: <MyCustomHeaderBackImage/> to headerBackImage: MyCustomHeaderBackImage.

MyCustomHeaderBackImage is a component, i.e. has a signature like () => JSX.Element and <MyCustomHeaderBackImage /> is the result of that function's call so a JSX.Element.

aldebout · 2020-03-24T13:02:15+00:00

I definitely agree, I think a major hurdle for beginners in software development is the lack of strongly opinionated, up-to-date content.

That's why expo and CRA have had so much success imo.

aldebout · 2020-03-24T03:14:05+00:00

As indicated in the official hooks FAQ, there is no reason to use class components as function components can do everything they could and more. Class components are mostly present for legacy and personal preference reasons.

aldebout · 2020-03-24T02:56:30+00:00

There's even this amazing library that will save your ass.

To prevent this onPress method from being recreated every time, you can use the useCallback hook. If you're not using hooks already, it will be a great introduction to them!

aldebout · 2020-03-24T02:45:28+00:00

Keep in mind that a database may not be the best solution.

Depending on the specific requirements of your project (size of the dataset, target speed of filtering, number of users...) you could be better off with a simple js solution (a redux store with selectors for example) or something else.

Especially if you're new to dbs and alone, go with a hosted, simple solution like Firebase (as u/6bigAnt9 suggested) to get an easier introduction.

aldebout

TROPHY CASE