How to create web app using React + Typescript

Client SDKs JavaScript SDK
1

I am trying to create web app using React (CRA) + Typescript for front end & use parse-server for backend.

I cannot find how to query parse object -> setState -> update list.

const Subscriber = () => {
  ... 
  const [subscribers, setSubscribers] = useState<Object | undefined>(undefined)
  ...
  useEffect(() => {
    subscriberQuery
        .find({
            useMasterKey: true
        })
        .then((data) => {
            console.log(data)   // (1) console log show an array but it is an object
            setSubscribers(data)
            return data
        })
        .catch(err => {
            console.log(err)
        })
    return () => {}
  }, [])
...
return (
<pre>
{
   subscribers &&
   // (2) I dont know how to map trough subscribers here
}
</pre>
)

}

I am so confused here.

At (1), in console, I can see an array of subscribers object.
At (2), subscribers is not an array, typescript not allow it. If I see in network response is like below. So, I think maybe it is an Object that contain results property which is an array.

{"results" : [ 
  {"objectId": "vE8GRdD9H0", .... } 
]}

I am so confused. If I take the raw results then work out around, maybe I can do it. But, I am using parse-js-sdk, there must be parse way.

I want to learn using React with Parse-sever backend. Please show me some source code example app. I already googled and didnot found the proper one.

Thank you.

Btw, dont you think it is time to change parse name? The parse word is so common word and it so frustrated to google and found a lot of parse that not related.
Anyone has tips to google about this parse better way

2

I believe the problem happens because you are defining your state as Object but should be ParseObject. try:

const [subscribers, setSubscribers] = useState<ParseObject[] | undefined>(undefined)
3

Thank you very much.

So it is an aray of ParseObject. Now I know.