728x90
반응형

1. 문제점

지금까지 만든 기능들을 연결해야 했다.

 

2. 시도해본 것들

 

3. 해결과정

기능하나씩 완성 시킨후

다른 파일과 연결작업 진행

 

4. 알게 된 점

기능을 만드는 것도 어렵지만

연결하는건 뭔가 머리속에서 딱딱 맞아떨어지지 않아 헷갈리고 어려웠다.

728x90
반응형
728x90
반응형

1. 문제점

오늘도 프로젝트에 필요한 HTML을 작성하고,

다른 팀원이 작성한 기능들은 어떻게 만들었는지 궁금했다.

 

2. 시도해본 것들

 

3. 해결과정

깃에서 git pull 받은후,

코드에 일일히 주석을 달아가면서 내용을 분석하고 있다.

 

4. 알게 된 점

강의를 듣고 개념공부하는 것도 좋지만

역시 코드를 뜯어보는게 직접 코딩하는 것보다 많은 도움이 되는 것 같다.

// 유저 로그인 페이지
router.post("/login/guest", async (req, res) => {
  // body에서 입력받은 로그인 아이디와 비밀번호를 가져온다
  const { login_id, login_pw } = req.body;

  try {
    // Guest데이터에서 로그인아이디가 로그인 아이디인 것에 대한 정보들을 guest라는 변수에 넣는다
    const guest = await Guest.findOne({
      where: { login_id },
    });
    // 입력받은 로그인 비밀번호와 db에 있는 로그인 비밀번호가 같은지 체크한 값을 pwCheck에 넣는다. compare = 트루펄스 반환
    const pwCheck = await bcrypt.compare(login_pw,guest.login_pw);
    // 로그인 아이디가 없는 값이거나 비밀번호 체크값이 없다면 에러문구 반환
    if (!guest || !pwCheck) {
      return res
        .status(412)
        .send({ errorMessage: "닉네임 또는 패스워드를 확인해주세요." });
    }
    // 로그인 아이디와 손님 아이디를 jwt에 등록하여 token이라는 변수값에 담아둔다
    const token = jwt.sign(
      { login_id: login_id, guest_id: guest.guest_id }, //paylord
      SECRET_KEY,
      {
        expiresIn: "1h",
      }
    );
    // ??? "token"은 무슨 의미지, 변수 token은 쿠키화 한다
    res.cookie("token", token);

    return res.json({ "token": token });
  } catch (err) {
    return res.status(400).send({ errorMessage: "로그인에 실패하였습니다." });
  }
});
module.exports = router;

 

728x90
반응형
728x90
반응형

1. 문제점

프로젝트에서 필요한 HTML이 많았다..!

간만에 만져보는데 역시 수평수직 중앙정렬도 헷갈리고

그외는 어떻게 분리해야할지 헷갈렸다.

 

2. 시도해본 것들

구글링도 해보고, AI에게 물어보기도 했다.

기본적으로 flex 세트를 썼지만 잘 먹히지 않았다.

 

3. 해결과정

예전에 많이 애먹었던 기억이 있는데 body,html에 너비높이를 100%로 줘서 해결했던 것이 기억이 났다.

그리고 헷갈리는 부분은 친구의 도움을 받았다.

 

4. 알게 된 점

친구가 비주얼스튜디오 live share를 통해 코딩하는 것을 도와줬다.

현업에서 일하는 친구의 코딩스타일을 보니 깔끔했고 많은 도움이 되었다.

아래의 코드는 나중에 다시 html 작업을 할때도 많은 도움이 될 것 같다.

 

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
  href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
  rel="stylesheet"
  integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
  crossorigin="anonymous"
/>
<title>🧺세탁 신청서🧺</title>
</head>
<style>
*{margin:0; padding:0;}
html,body{width:100%; height:100%;}
body{background-image:url("https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbdByfl%2FbtrVf7i5Uq5%2FjJ5afu7vrUKkgNGmzP2kAk%2Fimg.jpg"); background-repeat:no-repeat; background-size:cover;}
.flex_center{display:flex; align-items:center; justify-content:center; width:100%; height:100%;}
.status{border-radius: 50%; background-color: #6D67E4; width: 400px; height: 400px;}
</style>
<body>
<div class="flex_center">
  <h1 style="position:absolute; top:100px; text-align:center;">🧺세탁물 상태현황🧺</h1>
  <div class="status flex_center" style="color:#F2F7A1; font-size: 30px; font-weight:bold;">상태표시</div>
</div>
</body>
</html>
728x90
반응형
728x90
반응형

1. 문제점

프로젝트에서 ERD작성하고 기초부터 설계했습니다.

문제는 엄청나게 많이 터졌지만 계속 틀림그림 찾기하며, 해결해나갔다.

 

2. 시도해본 것들

팀원중 한분이 app.js와 cloth.js 폴더를 만들어서 연결하는 작업을 했는데

아무리 봐도 코드가 맞는데 2시간동안 팀원 전부가 도왔는데도,

코드가 똑같고 당연히 되야할 숙제코드(이미 완벽하고 검증된 코드)도

작동이 안되고 썬더클라이언트에서 404에러가 떴다!!!!!!!

 

3. 해결과정

마지막에 누군가 갑자기 한마디 했다.......

재부팅 해보죠? 그 결과 해결완료^_^

 

4. 알게 된 점

변수간의 철자로 인한 에러

라우터주소로 인한 에러

데이터 전송에서 변수값 에러 등등

수 많은 에러를 겪었지만

5명이 쳐다봐도 완벽(?)해 보이는 코드가 안되는건

재부팅 하면 해결될 수 있다는 사실을 배웠다.

728x90
반응형
728x90
반응형

1. 문제점

프로젝트를 위해 구상해야할 것을 팀원들과 회의하였다.

S.A 작성 및 제출
ERD 작성
역할 배분
개발 일정
구현 요구사항 체크리스트
공부 목록

2. 시도해본 것들

ERD 디비설계의 경우 다양한 것을 사용하다가 drawsql사이트를 이용하였다.

계속 변수명과 들어가야할 변수 등..

논의를 통해 최종적으로 아래와 같이 작성하였다.

 

3. 해결과정

팀원과의 논의

 

4. 알게 된 점

프로젝트 시작하면서 준비해야할 것들을 알게 되었다.

S.A / ERD작성 / 역활배분 / 개발 일정 등..

 

이번에 팀원 한분이 페어프로그래밍을 제안하셨다.

VS코드에서 Live share라는 것을 통해

같은 파일을 가지고 실시간 코딩을 진행할 수 있다.

 

5명을 2명/3명으로 나눠

기능을 Live share을 통해 구현하기로 하였다.

 

프로젝트가 걱정되면서도

같이 라이브코딩을 한다니 살짝 기대도 된다!

728x90
반응형
728x90
반응형

1. 문제점

노드js 심화과제2 를 하다가

시퀄라이즈 생성

데이터베이스 생성

모델 생성하다가 Comment를 Commnet로 잘못 설정하여 문제가 발생

2. 시도해본 것들

처음에는 되돌리기 기능

npx sequelize db:migrate:undo 를 사용했는데,

아무래도 파일명이 잘못 생성되서 효과가 없는듯 했다.

아예 데이터베이스를 삭제하고 새로 만들었다.

 

3. 해결과정

데이터베이스 삭제는 해당 DB에서 쿼리문을 실행하여 삭제하였다.

 

4. 알게 된 점

파이참에서는 DB가 직관적으로 보이고 직접 삭제 및 추가도 가능한데,

VS에서는 다른 방식으로 해결해야 했다.

 

에디터마다 장단점이 있긴 하지만

파이참이 유료인만큼 편한 점이 많은 것 같다.

 

그런데 VS에 익숙해져서

다시 파이참으로 돌아갈 수 있을지..

다음번부터는 파이참으로 코딩해봐야겠다

 

https://www.codetree.ai/

 

산타의 은밀한 연탄배달

코딩으로 따스함을 선물하세요🎁

www.codetree.ai

추가로 알고리즘 공부하기 좋은 사이트를 재관님으로부터 선물 받음!

JS는 안되지만 개념, 해설 등

초보자에게 도움이 되는 것 같다. 알고리즘 공부도 꾸준히 해야지!

728x90
반응형
728x90
반응형

1. 문제점

현재 이론 공부만 하고 직접 코딩을 안해서 자신감이 바닥인 상태이다.

심화과제를 안한 사람들을 찾아서 어떻게든 과제를 실행하자고 얘기를 나눴다

2. 시도해본 것들

1. DB설계

2. 순서대로 작성 (분석시간->작성시간)

3. 강의 듣고 나서 끄고, 머리에 남은 상태로 손코딩

4. 각자 서버 실행하고 오류없는지 보기 (서로 오류확인)

 

3. 해결과정

각자 코드를 작성하고, 문제가 생기면

화면공유를 통해 오류를 확인하고 해결해나갔다.

 

 

4. 알게 된 점

이론만 공부하면 안된다ㅠㅠㅠ

손코딩을 직접해보고 고민해봐야 머리에 들어온다.

728x90
반응형
728x90
반응형

1. 문제점

보자마자 for문으로 하나씩 넣으면 되겠다 싶었다.

최근 일반for문보다 익히기 시작한 for of문으로 돌려야지!

2. 시도해본 것들

for of를 사용하고 나니

answer[ i ] 에 해당하는 자동증가문이 없네..?

 

3. 해결과정

그럼 내가 셀프로 만들어야지! 하고 추가완료

function solution(strlist) {
    var answer = [];
    let count = 0;
    for (str of strlist){
        answer[count] = str.length;
        count++;
    }
    return answer;
}

4. 알게 된 점

이제 나도 일반 for문뿐 아니라

 for of도 자연스럽게 사용할 수 있게 된듯?

728x90
반응형

+ Recent posts