[New] Sign-In 화면 추가

+import React, { useState, useEffect } from 'react'
+import { useHistory, Redirect } from 'react-router-dom'
+import {
+  Container,
+  Heading,
+  Button,
+  Segment,
+  Message,
+  Divider,
+  Form,
+  Input,
+  Transition,
+  Select,
+  Checkbox,
+  FormControl,
+  FormLabel,
+  FormErrorMessage,
+  FormHelperText,
+  VStack,
+  Stack,
+  StackDivider,
+  Box,
+  Text,
+  InputGroup,
+  InputLeftElement,
+  InputRightElement,
+} from '@chakra-ui/react'
+import { PhoneIcon } from '@chakra-ui/icons'
+import http from '../utils/http'
+
+const SignIn = () => {
+  const [username, setUsername] = useState('')
+  const [password, setPassword] = useState('')
+
+  const handleUsernameOnChange = (event) => {
+    setUsername(event.target.value)
+  }
+
+  const handlePasswordOnChange = (event) => {
+    setPassword(event.target.value)
+  }
+
+
+  useEffect(() => {
+  }, [])
+
+  return (
+    <Container>
+      <Heading>Sign-In</Heading>
+      <br />
+
+      <Stack
+        // divider={<StackDivider borderColor="gray.200"/>}
+        spacing={4}
+        align="stretch"
+      >
+        <Input
+          type="text"
+          placeholder="username"
+          value={username}
+          onChange={handleUsernameOnChange}
+        />
+
+        <InputGroup size="md">
+          <Input
+            pr="4.5rem"
+            type="password"
+            placeholder="Enter password"
+            value={password}
+            onChange={handlePasswordOnChange}
+          />
+          <InputRightElement width="4.5rem">
+          </InputRightElement>
+        </InputGroup>
+
+        <Button
+          colorScheme="teal"
+        >
+          Sign In
+        </Button>
+      </Stack>
+    </Container>
+  )
+}
+
+export default SignIn