내일배움캠프 TIL(221118): 팀 소개 프로젝트 발표, 특강

Jiumn·2022년 11월 18일
0
post-thumbnail

오늘 한 일

팀 소개 프로젝트 발표날이었다!
어제까지 거의 모든 수정사항을 반영했다고 생각했지만...(개인 방명록을 팀 방명록으로 대체한 것 외에)
아침에 방명록과 버킷리스트에 공백 문자를 허용하지 않는 조건문을 완성하지 못했다는 걸 깨닫게 되고...

부랴부랴 팀원들이 고민하여 코드를 완성했다.

// 버킷 저장함수, 공백은 허용하지 않음.
function save_bucket(){
    let bucket = $('#bucket').val()
        bucket = bucket.replaceAll(" ", '')
            if (bucket == ""){
                return alert("공백은 허용 되지 않습니다.")
            }
//방명록 저장 함수, 공백은 허용하지 않음
function save_comment() {
    let name = $('#name').val()
    let comment = $('#comment').val()
        name = name.replaceAll(" ", '')

        if(name === '' || comment === ''){
            return alert("공백은 허용되지 않습니다.")
        }

여기서 repalceAll은 특정 문자를 특정 문자로 변경해주는 메서드다.
해당 메서드로 띄어쓰기가 있을 때 공백이 없도록 처리해주고,
그 변수를 조건문에 넣어서 다시 한번 입력값이 없는지 확인한다.
다만 코멘트는 내용을 입력하는 부분이라 띄어쓰기가 있을 수 있어서
이름을 입력하는 부분만 띄어쓰기가 없도록 처리한다.

이외에도 방법이 다양한 것 같은데 공백 관련해서 좀 더 공부해봐야겠다.

첫 프로젝트 발표 후 느낀 점

총 10팀이 발표했는데 3시간 반이 넘게 걸려서 끝났다. (...)
다들 본인의 프로젝트에 엄청난 애착을 갖고 계신 듯.
특히 자신의 코드를 신나서 설명하시는 분들도 있었는데 너무 감명 깊었다.
나도 언젠가 내 코드를 자랑할 마음에 두근두근하기를...!

다들 문제를 해결할 때 작은 부분부터 생각해나가는 사고력이 뛰어나신 것 같다.
나도 앞으로 큰 문제를 해결할 때 작은 조각부터 나눠서 생각하는 연습을 해야겠다.
매일 새벽까지 플젝을 위해서 나도 꽤 늦게까지 열심히 했다고 생각했는데,
다음날 동틀 때까지 있었던 분들이 많다고 하셔서 좀 놀랐다.

첫 프로젝트는 발표 후 깃허브 원격저장소에 푸시되었다.
그리고 KPT 회고를 처음으로 작성했다.

내가 쓴 첫 KPT 회고

keep:
항상 배려하면서 서로 의견을 존중하는 것이 좋다.
반복된 질문에도 항상 친절하게 설명해준다.
problem:
각자 작성하는 코드를 합칠 때 중복되는 코드들이 있어서 원활하게 합쳐지지 않는다.
각자 메인 페이지를 만들고 괜찮은 것을 합치는 방식으로 했기 때문에 메인 페이지 디자인의 통일성이 떨어진다.
try:
CSS 작성 시 본인의 클래스는 다른 사람과 겹치지 않도록 라벨링을 한다.
Git과 GitHub 사용법을 익혀서 연습한다.
개발 전 와이어프레임을 구체적으로 짜고 협의된 레이아웃과 기능으로 개발한다.

매주 금요일 저녁에 하는 특강이 있었다.
리액트 튜터님이 와서 프로세스, 스레드, 비동기에 대해 강의해주셨는데...
음... 강의 내용은 솔직히 쉽지 않았고 블로그로 찾은 개념들이 있는데 그거라도 정리해야겠다.

프로세스와 프로그램의 차이는?

  • CPU: 요리사
  • RAM: 책상 (요리를 할 수 있는 책상)

프로그램 자체는 생명이 없음.
프로그램은 보조 기억장치(하드디스크, SSD)에 존재하며 실행되기를 기다리는 명령어(코드)와 정적인 데이터의 묶음.
이 프로그램의 명령어와 정적 데이터가 메모리에 적재되면 생명이 있는 프로세스가 됨.

즉 프로세스란 실행 중인 프로그램.

CPU(프로세서)는 한번에 하나의 프로세스만 실행할 수 있음.

https://bowbowbow.tistory.com/16

일반적으로 하나의 프로그램은 하나의 스레드를 가지고 있지만, 프로그램의 환경에 따라 다수의 스레드를 동시에 실행할 수 있으며 이러한 실행 방식을 멀티스레드(Multi Thread)라고 합니다.

https://cocoon1787.tistory.com/849

강의에서 유일하게 이해된 부분인 것 같다.
비동기와 동기의 차이를 설명해주시는 부분이었는데,
구글에서 apple을 검색할 때 알파벳을 하나씩 입력할 때마다 자동완성이 불러와지는 기능이 가능한 것은 비동기이기 때문이라고 한다.
크롬 개발자도구에서 네트워크 창을 열어보면 검색창에 글자를 입력할 때마다 호출되는 값을 확인할 수 있다.
만약 동기였다면 a 다음 알파벳을 검색할 수가 없다. 왜냐하면 a가 입력된 후에 그에 맞는 값이 호출되고, 이것이 처리되어야만 다음 작업을 수행할 수 있기 때문이다.

To-do list

  • 모던 자바스크립트 3~6장 공부하기
  • 인프런 깃 강의 듣기
profile
Back-End Wep Developer. 꾸준함이 능력이다. Node.js, React.js를 주로 다룹니다.

0개의 댓글