Just Do IT!

스파르타코딩클럽 내일배움캠프 14일차 본문

스파르타코딩클럽 내일배움캠프/TIL

스파르타코딩클럽 내일배움캠프 14일차

MOON달 2022. 11. 17. 21:27
728x90
반응형
오늘 일과 간단 요약
  1. 알고리즘 강의 완강
  2. 웹퍼블리싱 강의 4주차 완강
  3. Git 강의 1주차 완강 (2강 9차시까지)
  4. Firebase 특강

 

 

 

 

 

 

드디어 알고리즘 강의 완강

드디어 5주차까지 멀게만 느껴졌던 강의를 끝냈다.

약간 숙제 끝낸 것 같기도 하고...?ㅋㅋㅋㅋㅋㅋ

어제는 라인과 카카오 코딩테스트 문제였는데 오늘은 삼성 역량 테스트였다.

전혀 놀랍지 않게도 풀지 못하고 해설 강의처럼 들었다 ㅋㅋㅋㅋ

마치 내가 처음 대학 수업으로 갑자기 c++로 게임을 만들라는 과제를 받았던 때처럼...

걍 한 귀로 흘리는 것처럼 들었다...ㅠ

좀 더 실력을 갈고 닦은 뒤에 다시 들어보면 또 다른 느낌이겠지.

 

솔직히 이렇게 전부 이해를 못하거 가서 약간 마음이 찜찜하지만,

일단 큰 틀을 배웠다고 생각하려고 한다.

지금 당장 어떻게 쓸 수는 없겠지만...

지금은 아직 level 0 도 조금씩 풀고 있는 처지지만, 꾸준히 하다보면 좀 더 나아지겠지.

 

일단 끝냈다는 것 자체가 좋고 (얼레벌레 끝냈지만)

내일부터는 프로젝트 시작이라 사실 TIL을 쓰는 지금도 그 걱정이 한트럭이다 ㅋㅋㅋㅋ

아무튼 알고리즘 완강!

 

 

 

 

웹 퍼블리싱 강의 4주차

탭 중첩 구조와, 반응형 웹페이지에 대해 배웠다.

 

 

간단 요약
  • 검색창 : Form 태그
  • GNB : 드롭다운, Hover 애니메이션
  • 날씨 알리미 : 세로(Vertical) 슬라이더
  • 로그인 : Form 태그
  • 트랜드쇼핑 : 가로(Horizon) 슬라이더, 탭
  • 뉴스스탠드 : 이중 탭
  • 오늘 읽을만한 글 : 가로(Horizon) 슬라이더, 탭 (이번주차 과제)

 

반응형(responsive) 웹 이해하기
  • 반응형 웹 : 다양한 디스플레이 종류에 따라 화면과 요소 크기가 자동으로 재조정 되는 것
  • 고정형 웹
  • 최근에는 반응형으로 만들지 않는 경우가 더 많아졌다

 

 

4주차까지만 듣고 프로젝트를 진행해도 되나 싶은데, 일단 프로젝트를 진행하면서 들을지 말지 정해야 할 것 같다.

웹 퍼블리싱 강의에서 필요한 부분은 정해져 있어서 그것들이라도 들어서 다행이다.

 

1주차

오늘 배울 것 - 퍼블리싱 기본 개념

HTML, CSS 기본 내용

개발자 도구 기본 내용

2주차

폼 태그 기본과 실습

3주차

Swiper.js 살펴보기

가로 슬라이더 만들기 - 기능 구현

탭 구조에 대한 개념잡기

4주차

탭 중첩 구조 이해하기

반응형 웹 이해하기

반응형 로그인창 만들기 - 구조 설계

반응형 로그인창 만들기 - 스타일링

 

 

이 부분들이 프로젝트 할 때 필요한 부분인데, 일단 실습은 해봤는데

저번의 경험으로 보면, 절대로 실습을 해봤다고 해서 좋은 게 아니라서 조금 걱정이긴 하다.

알고리즘에 정신 팔려서 html, css 부분 공부를 좀 소홀히 한것 같은데 프로젝트할 때 다시 열심히 해야지...

그래도 실습하는 게 재밌긴 하다.

 

 

 

 

 

Git 강의 1주차 완강, 2주차 9차시까지

사실 Git 강의를 들으려고 계획한 건 아니었다.

알고리즘 강의 완강하고 바로 프로그래머스 풀려다가 머리가 더 복잡해질 것 같아서 접고

웹 퍼블리싱 강의를 들었는데 그 이후 특강까지 시간에 뭘 할지 고민하다가 git 강의를 들어보았다.

 

어차피 내일부터 협업할 때 사용해야 할 텐데, 일요일에 공부했다고 아무 대비도 하지 않는 것보다

지금 아예 다시 정리를 해두는 게 낫다고 생각해서 2주차 협업하는 부분까지는 그래도 다 배웠다.

충돌 부분을 끝까지 듣지 못해서 아쉽지만, 이건 나중에 필요할 때 듣는 걸로...

협업할 때 필요한 부분은 브랜치 따서 각자의 브랜치에서 하는 게 중요하니까.

여튼 그 부분을 여기에 기록해둬야겠다.

 

 

Issue 할당
  • Issue : 프로젝트에서 해결해야 할 문제
    • 버그 (프로그램이 원하는 대로 동작하지 않는 것)를 신고 (Bug, report)
    • 기능 추가 등의 프로젝트 개선 제안 (enhancement)
    • 위 문제들을 해결하기 위한 작업 단위
  • Github 외에도 이슈 관리를 할 수 있는 도구는 Jira, Trello, YouTrack 등이 있다.
  • ⇒ 이슈 트래커 (issue tracker) 또는 이슈 추적 도구(Issue Tracking Tool)
Branch
  • 브랜치를 사용하게 되면 나뭇가지가 뻗어나오듯 기능에 맞게 나누어 작업할 수 있다
  • 브랜치 삭제는 모든 기록을 삭제하겠다는 의미로 주의해서 삭제해야 한다.

git 강의에서 나온 그림

  • 새로운 브랜치 만들기
    • 소스트리에서 만들기
      • 새 브랜치 : 브랜치 이름을 적어주세요. 내가 잘 관리할 수 있게 적어주세요. 여기서는 feature/이슈번호_관리쉬운이름 형식으로 만들어줍시다.
      • feature 는 기능 개발하는 브랜치에 관행적으로 붙여주는 이름입니다! 여기서는 feature/2_jjigae 로 만들어주었습니다. 내가 아까 원격 repo github 페이지에 만들었던 이슈번호에 따라서 숫자가 달라지겠죠?
      • 정보를 입력한 후 '브랜치 생성' 버튼을 누릅니다.
    • 터미널에서 만들기 
새로운 브랜치 생성하기
$ git branch <브랜치이름> 

해당 브랜치로 체크아웃하기 (현재 선택한 브랜치로 작업하겠다는 의미) 
$ git checkout <브랜치이름> 

새로운 브랜치를 만듦과 동시에 체크아웃하기 (수업에서 다루지는 못했지만 유용합니다) 
$ git checkout -b <브랜치이름> 

브랜치 병합하기 
$ git merge <브랜치이름>

 

Merge
  • merge : 브랜치를 다른 브랜치에 합치는 것
  • 특정 브랜치의 commit 들을 다른 브랜치의 commit 내역에 모두 반영한다는 의미
  • 실제 프로젝트에서는 작업 내역을 모두 합칠 기준이 되는 브랜치를 정해두고 작업한다. 보통 (main 브랜치)
  • git merge <브랜치 이름>

 

충돌 해결하기 (merge conflict)
  • merge를 할 때 발생하는 충돌
  • 하나의 파일을 여러 브랜치에서 수정하고 하나의 branch에 merge하려고 할 떄 merge conflict (병합 충돌)이 발생한다
  • 양 쪽에서 내용이 수정되었는데 어떤 내용을 반영하면 좋을 지 선택할 수 있다.
    • 이 merge confilct 를 고치려면,
    • 내가 원하는 대로 파일을 수정하고(어떤 내용을 반영할지 결정)
<<<<<<< HEAD , ======= , >>>>>>> 충돌나는 브랜치명 또는 commmit 아이디 를 지우면 됩니다. 그러면 Git 이 해결되었구나! 하고 알아듣습니다.

그런 후에 이렇게 수정된 파일을 commit 하면 됩니다!
  • <<<<<<< HEAD {현재 브랜치의 다른 파일 내용} ======= {충돌나는 브랜치명 또는 commit에서의 다른 파일 내용} >>>>>>> 충돌나는 브랜치명 또는 commmit 아이디

 

원격 repo와 branch
  • 원격 repo와 로컬 repo가 연결되어있따는 의미는 각각 브랜치가 연결된 것과 같다.
  • 따로 설정하지 않으면 기본적으로 로컬 repo의 브랜치명과 같게 원격 repo의 브랜치명이 생성되어 tracking 된다. (보통 origin)
  • pull과 push는 결국 특정 branch (tracking branch)에 있는 commit을 여기와 연결되어 있는 branch에 가져오는 것이다.

 

 

 

 

 

 

 

Firebase 강의
서버리스 (Serverless) 개념 이해
  • 서버 관리 없는 백엔드
  • 어플리케이션 배포 역사 : 하드웨어, 스프트웨어 전부 직접 관리 -> 하드웨어만 관리 위임(EC2) -> 소프트웨어 관리 위임 (Firebase, AWS Lambda)
  • 대표적인 서버리스 서비스
    • AWS Lambda : API 함수 직접 등록 필요 (FaaS) (function as a service) >> 용어는 알아만 둘것
    • Firebase : 별도의 서버 설정 없이 바로 백엔드 서비스 이용 가능 (BaaS)

 

 

Firebase 서비스 소개
  • 별도의 서버나 DB를 직접 관리하지 않아도 백엔드 서비스를 이용할 수 있는 백엔드 플랫폼
  • 주로 사용할 서비스 3가지
    • Authentication : 회원가입, 로그인, 프로필 관리
    • Firestore : CRUD API를 제공 및 NoSQL DB 제공
    • Storage : 파일 업로드 및 다운로드 URL

 

 

+)

직접 실습해보고 싶었는데,

아직 강의 영상이 올라오지 않아서 결국 내일로 미뤘다.

바로 해보고 싶었는데 좀 아쉬운 부분이다.

 

내일은 프로젝트라서 과연 복습할 시간이 있을까 모르겠지만...

 

사실 예전에 flutter+firebase 강의를 인프런에서 무료로 수강한 적이 있었는데,

그 때는 급하기 flutter을 배워야 할 일이 있어서 firebase 쪽은 아예 대충 보고 넘어갔었는데,

불현듯 그 때의 기억이 떠올랐다.

 

지금 내 계정 들어가보니까 연습했던 게 아직도 남아있네...신기하다.

무작정 따라치기만 했었는데, 지금 다시 복습할 생각하니까 재밌을 것 같기도 하고 좀 어려울것 같기도 하고...

직접 해봐야 아는 거니까 미리부터 걱정하지는 않기로..ㅎ

 

강의는 진짜 너무 좋았다.

실시간이라서 피드백도 주고받을 수 있고, 실제로 페이지가 돌아가는 모습을 볼 수 있으니까.

저걸 내가 직접 해봐야 하는 게 두렵긴 하지만. 강의는 정말 좋았다.

 

 

 

 

 

 

 

짧은 일기

이제는 호낮 공부하던 시간을 끝내고,

새로운 프로젝트를 할 시간이 다가왔다.

 

새로운 조원들과 친해지지 않아서 좀 아쉬웠는데, 프로젝트를 계기로 친해질 것 같아서 기대가 된다.

비록 프로젝트는 어렵겠지만...ㅠ

 

아직 안 해봐서 어렵게 느껴지는 거라고 생각하고,

오늘 실시간 강의에서 배운거 + SPA 공부 하면 못할 것도 없겠지...?

조원 모두 함께 하는 거니까 안되진 않을 거라고 생각하며...ㅎ

 

어려운 걸 배워서 마무리 하는게 좀 정신없고 복잡하지만, 그래도 하루가 짧다.

내일은 프로젝트 시작이니까, 새로운 마음으로 시작하길.

728x90