김대휘 / Do-gether

Go to a project
Toggle navigation Toggle navigation pinning
김대휘
3771bd52 1 parent 73a1bf37

Express

Inline Side-by-side
Showing 16 changed files with 124 additions and 80 deletions
1 +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 +
3 +# dependencies
4 +/node_modules
5 +/.pnp
6 +.pnp.js
7 +
8 +# testing
9 +/coverage
10 +
11 +# production
12 +/build
13 +
14 +# misc
15 +.DS_Store
16 +.env.local
17 +.env.development.local
18 +.env.test.local
19 +.env.production.local
20 +
21 +npm-debug.log*
22 +yarn-debug.log*
23 +yarn-error.log*
...\ No newline at end of file ...\ No newline at end of file
1 +{
2 + "name": "do-gether",
3 + "version": "0.1.0",
4 + "private": true,
5 + "dependencies": {
6 + "@material-ui/core": "^4.10.1",
7 + "@material-ui/icons": "^4.9.1",
8 + "@testing-library/jest-dom": "^4.2.4",
9 + "@testing-library/react": "^9.3.2",
10 + "@testing-library/user-event": "^7.1.2",
11 + "react": "^16.13.1",
12 + "react-dom": "^16.13.1",
13 + "react-scripts": "3.4.1"
14 + },
15 + "scripts": {
16 + "start": "react-scripts start",
17 + "build": "react-scripts build",
18 + "test": "react-scripts test",
19 + "eject": "react-scripts eject"
20 + },
21 + "eslintConfig": {
22 + "extends": "react-app"
23 + },
24 + "browserslist": {
25 + "production": [
26 + ">0.2%",
27 + "not dead",
28 + "not op_mini all"
29 + ],
30 + "development": [
31 + "last 1 chrome version",
32 + "last 1 firefox version",
33 + "last 1 safari version"
34 + ]
35 + }
36 +}
...@@ -2,12 +2,22 @@ import React from "react"; ...@@ -2,12 +2,22 @@ import React from "react";
2 import { makeStyles } from "@material-ui/core/styles"; 2 import { makeStyles } from "@material-ui/core/styles";
3 import Grid from "@material-ui/core/Grid"; 3 import Grid from "@material-ui/core/Grid";
4 import Container from "@material-ui/core/Container"; 4 import Container from "@material-ui/core/Container";
5 +import Icon from '@material-ui/core/Icon';
5 6
6 import TodoCard from "./TodoCard.js"; 7 import TodoCard from "./TodoCard.js";
8 +
9 +const data={
10 + date:"2020-99-99",
11 + title:"머휘의 TODO LSIT",
12 + todo:["응가하기","똥싸기","변누기"]
13 +}
14 +
7 const useStyles = makeStyles((theme) => ({ 15 const useStyles = makeStyles((theme) => ({
8 root: { 16 root: {
9 flexGrow: 1, 17 flexGrow: 1,
10 - marginTop: "1rem", 18 + backgroundColor:"#e9e9e9",
19 + paddingTop:"4rem",
20 + marginTop:"0"
11 }, 21 },
12 item: { 22 item: {
13 marginLeft: "auto", 23 marginLeft: "auto",
...@@ -22,24 +32,11 @@ export default function CenteredGrid() { ...@@ -22,24 +32,11 @@ export default function CenteredGrid() {
22 <Container className={classes.root} maxwidth="sm"> 32 <Container className={classes.root} maxwidth="sm">
23 <Grid className={classes.item} container spacing={3}> 33 <Grid className={classes.item} container spacing={3}>
24 <Grid item xs="6" sm="6" md="3"> 34 <Grid item xs="6" sm="6" md="3">
25 - <TodoCard></TodoCard> 35 + <TodoCard data={data}/>
26 - </Grid>
27 - <Grid item xs="6" sm="6" md="3">
28 - <TodoCard></TodoCard>
29 - </Grid>
30 - <Grid item xs="6" sm="6" md="3">
31 - <TodoCard></TodoCard>
32 - </Grid>
33 - <Grid item xs="6" sm="6" md="3">
34 - <TodoCard></TodoCard>
35 </Grid> 36 </Grid>
36 - <Grid item xs="6" sm="6" md="3"> 37 + <Grid item xs="6" sm="6" md="3" alignItems="center">
37 - <TodoCard></TodoCard> 38 + <Icon style={{ fontSize: 60 }}>add_circle</Icon>
38 - </Grid>
39 - <Grid item xs="6" sm="6" md="3">
40 - <TodoCard></TodoCard>
41 </Grid> 39 </Grid>
42 -
43 </Grid> 40 </Grid>
44 </Container> 41 </Container>
45 ); 42 );
......
...@@ -27,7 +27,7 @@ export default function ButtonAppBar() { ...@@ -27,7 +27,7 @@ export default function ButtonAppBar() {
27 27
28 return ( 28 return (
29 <div className={classes.root}> 29 <div className={classes.root}>
30 - <AppBar className={classes.bar} position="static"> 30 + <AppBar className={classes.bar} position="fixed">
31 <Toolbar> 31 <Toolbar>
32 <IconButton edge="start" className={classes.menuButton} color="inherit" aria-label="menu"> 32 <IconButton edge="start" className={classes.menuButton} color="inherit" aria-label="menu">
33 <MenuIcon /> 33 <MenuIcon />
......
...@@ -2,58 +2,53 @@ import React from "react"; ...@@ -2,58 +2,53 @@ import React from "react";
2 import { makeStyles } from "@material-ui/core/styles"; 2 import { makeStyles } from "@material-ui/core/styles";
3 import Card from "@material-ui/core/Card"; 3 import Card from "@material-ui/core/Card";
4 import CardContent from "@material-ui/core/CardContent"; 4 import CardContent from "@material-ui/core/CardContent";
5 -import Button from "@material-ui/core/Button";
6 import Typography from "@material-ui/core/Typography"; 5 import Typography from "@material-ui/core/Typography";
7 import FormControlLabel from "@material-ui/core/FormControlLabel"; 6 import FormControlLabel from "@material-ui/core/FormControlLabel";
8 import Checkbox from "@material-ui/core/Checkbox"; 7 import Checkbox from "@material-ui/core/Checkbox";
8 +import Icon from "@material-ui/core/Icon";
9 9
10 const useStyles = makeStyles({ 10 const useStyles = makeStyles({
11 - root: { 11 + root: {},
12 + date: {
13 + fontSize: 14,
14 + float: "left",
15 + },
16 + icon: {
17 + marginRight: "1%",
18 + float: "right",
19 + color: "black",
12 }, 20 },
13 title: { 21 title: {
14 - fontSize: 14, 22 + clear: "both",
15 }, 23 },
16 pos: { 24 pos: {
17 marginBottom: 12, 25 marginBottom: 12,
18 }, 26 },
19 }); 27 });
20 28
21 -export default function SimpleCard() { 29 +export default function TodoCard(props) {
22 const classes = useStyles(); 30 const classes = useStyles();
23 31
24 return ( 32 return (
25 <Card className={classes.root}> 33 <Card className={classes.root}>
26 <CardContent> 34 <CardContent>
27 - <Typography 35 + <Typography className={classes.date} color="textSecondary" gutterBottom>
28 - className={classes.title} 36 + {props.data.date}
29 - color="textSecondary"
30 - gutterBottom
31 - >
32 - 2020-03-26
33 </Typography> 37 </Typography>
34 - <Typography variant="h5" component="h2"> 38 + <Icon className={classes.icon} color="primary">
35 - Todo Main 39 + settings
40 + </Icon>
41 + <Typography className={classes.title} variant="h5" component="h2">
42 + {props.data.title}
36 </Typography> 43 </Typography>
37 - <div> 44 + {props.data.todo.map((todo) => {
38 - <FormControlLabel 45 + return (
39 - control={<Checkbox name="checkedC" />} 46 + <div>
40 - label="똥싸기" 47 + <FormControlLabel control={<Checkbox />} label={todo} />
41 - /> 48 + </div>
42 - </div> 49 + );
43 - <div> 50 + })}
44 - <FormControlLabel
45 - control={<Checkbox name="checkedC" />}
46 - label="똥싸기"
47 - />
48 - </div>
49 - <div>
50 - <FormControlLabel
51 - control={<Checkbox name="checkedC" />}
52 - label="똥싸기"
53 - />
54 - </div>
55 - <Button size="small">Learn More</Button>
56 </CardContent> 51 </CardContent>
57 - </Card> 52 + </Card>
58 ); 53 );
59 } 54 }
......
This diff could not be displayed because it is too large.
1 { 1 {
2 "name": "do-gether", 2 "name": "do-gether",
3 - "version": "0.1.0", 3 + "version": "1.0.0",
4 - "private": true,
5 - "dependencies": {
6 - "@material-ui/core": "^4.10.1",
7 - "@material-ui/icons": "^4.9.1",
8 - "@testing-library/jest-dom": "^4.2.4",
9 - "@testing-library/react": "^9.3.2",
10 - "@testing-library/user-event": "^7.1.2",
11 - "react": "^16.13.1",
12 - "react-dom": "^16.13.1",
13 - "react-scripts": "3.4.1"
14 - },
15 "scripts": { 4 "scripts": {
16 - "start": "react-scripts start", 5 + "client": "cd client && yarn start",
17 - "build": "react-scripts build", 6 + "server": "nodemon server.js",
18 - "test": "react-scripts test", 7 + "dev": "concurrently --kill-others-on-fail \"yarn server\" \"yarn client\""
19 - "eject": "react-scripts eject" 8 + },
9 + "dependencies": {
10 + "body-parser": "^1.18.3",
11 + "express": "^4.16.4"
20 }, 12 },
21 - "eslintConfig": { 13 + "devDependencies": {
22 - "extends": "react-app" 14 + "concurrently": "^4.0.1"
23 }, 15 },
24 - "browserslist": { 16 + "proxy": "http://localhost:5000/"
25 - "production": [
26 - ">0.2%",
27 - "not dead",
28 - "not op_mini all"
29 - ],
30 - "development": [
31 - "last 1 chrome version",
32 - "last 1 firefox version",
33 - "last 1 safari version"
34 - ]
35 - }
36 } 17 }
......
1 +const express = require('express');
2 +const bodyParser = require('body-parser');
3 +const app = express();
4 +const port = process.env.PORT || 5000;
5 +app.use(bodyParser.json());
6 +app.use(bodyParser.urlencoded({ extended: true }));
7 +
8 +app.get('/api/hello', (req, res) => {
9 +res.send({ message: 'Hello Express!' });
10 +});
11 +
12 +app.listen(port, () => console.log(`Listening on port ${port}`));
...\ No newline at end of file ...\ No newline at end of file
File mode changed
File mode changed
This diff could not be displayed because it is too large.