我是新的React，并不完全了解渲染。我创建了一个React应用程序与react-create-app，现在开发一个简单的React组件，但不能显示主页，虽然当它完美的编译。我
它正在呈现我的代码吗？
有人能解释一下吗？
App.js文件：

import { Button } from "react-bootstrap";
import Card from "react-bootstrap/Card";
import CardDeck from "react-bootstrap/CardGroup";
import { useEffect, useState } from "react";
import axios from "axios";

import "./App.css";

function App() {
  const [loggedIn, setLoggedIn] = useState(false);
  const [user, setUser] = useState(null);

  useEffect(() => {
    const token = new URLSearchParams(window.location.search).get(
      "access_token"
    );
    axios
    .get("http://localhost:8010/proxy/user", {
      headers: {
        Authorization: "token" + token,
      },
    })
    .then((res) => {
      setUser(res.data);
      setLoggedIn(true);
    })
    .catch((err) => {
      console.log("error" + err);
    });
  });

  return (
    <div className="App text-center container-fluid">
      {!loggedIn ? (
        <>
          <img
            className="mb-4"
            src="https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png"
            width={150}
            alt="gitMark"
          ></img>
          <h1 className="h3 mb-3 font-weight-normal">Sign in with GitHub</h1>
          <Button
            type="primary"
            className="btn"
            size="lg"
            href={
              "https://github.com/login/oauth/authorize?client_id=&...redirect_uri=http://localhost:8080/oauth/redirect"
            }
          ></Button>
        </>
      ) : (
        <>
          <h1> Welcome </h1>

          <CardDeck>
            {[...Array(3)].map((e, i) => (
              <Card style={{ maxWidth: "25%", margin: "auto" }}>
                <Card.Img variant="top" src={user.avatar.url} />
                <Card.Body>
                  <Card.Title> {user.name} </Card.Title>
                  <Card.Text> {user.bio} </Card.Text>
                  <Button
                    variant="primary"
                    target="_blank"
                    href={user.html_url}
                  >
                    GitHub Profile
                  </Button>
                </Card.Body>
              </Card>
            ))}
          </CardDeck>
        </>
      )}
    </div>
  );
}

export default App;

index.js文件：

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
        <div>hello</div>
    <App />
  </React.StrictMode>
);

reportWebVitals();

我的密码怎么了？我找不到。
以下是错误：