벌꿀오소리의 아카이브

10월 30일 일요일 밤 8시 30분, Toy Project의 첫 킥오프 미팅의 날! 사실 처음 제안이 왔을 땐 부트캠프 시작 전이라 시간이 없을 것 같기도 했고, 개발자들과 일해본적도 없어 좀 망설였었다. 하지만 이렇게 개발자스러운(ㅋㅋㅋㅋㅋ) 프로젝트를 또 언제 진행해보겠나 싶어 겁도없이 하겠다고 덤벼버림. 이거친세상속에뛰어든건나니까 암오케이...! 팀은 알음알음 아는 사람들끼리 다리를 건너 이렇게 구성되었다. 백엔드 개발자 2명 프론트엔드 개발자 1명 디자이너 1명 (이게 나라니!) 이번 토이 프로젝트를 통해 서로 얻고 싶은 인사이트도 공유했다. 👓 TM (백엔드) 토이프로젝트를 진심으로 수립해본 것은 처음. 만드는 과정 자체가 열정적이고 즐거웠으면 좋겠다. 💪 YY (백엔드) 백엔드는 사용자와 실..

HTML이 웹의 구조를 담당한다면, CSS는 HTML로 구성한 구조의 내/외부를 꾸미는 역할이다. 같은 HTML구조를 가지고 있더라도 각기 다른 CSS 파일을 적용하면 전혀 다른 웹사이트처럼 보이게 할 수도 있다. CSS와 프론트엔드 개발 CSS(Cascading Style Sheets)란 웹페이지 스타일 및 레이아웃을 정의하는 스타일시트 언어이다. HTML로 웹 페이지의 구조를 잘 세우고 난 뒤, 더 나은 사용자 경험(UX, User Experience)을 제공하기 위해 CSS로 UI 및 레이아웃을 적절히 구성하면 멋진 웹페이지를 완성할 수 있다. 📌 UI, User Interface 초기 컴퓨터는 자신이 만든 애플리케이션과 소통하기 위해 복잡한 코드를 이용해 소통했다. 하지만 최근은 이미 입력되어 있..

HTML(HyperText Markup Language)은 JS같은 프로그래밍 언어가 아니라, 웹 페이지의 뼈대를 구성하는 마크업 언어이다. 우리는 HTML로 구성된 뼈대 위에 JavaScript로 기능을 구현하고, CSS로 스타일을 입히게 된다. 구분하자면 아래와 같다. HTML : 구조(structure) 웹페이지의 구조를 담당하는 마크업 언어 CSS : 스타일(Presentation) 디자인 요소를 시각화하는 스타일시트 언어 JavaScript : 상호작용(Interaction) 웹페이지를 유저와 상호작용하게 만드는 프로그래밍 언어 HTML? HyperText Markup Language의 약자 웹페이지의 틀을 만드는 마크업 언어 html이라는 확장자를 사용 부등호기호로 묶인 태그들의 집합 태그는 ..

사는 것이 언제나 그렇지만 이번 10월도 정말 별별일이 다 있었다. 행사부스 스태프, 친구랑 건대에서 번개, 가족여행도 다녀오고. 그래도 가장 큰 건 부트캠프 수강과 코로나 아닐까. 이 두 개가 불러온 생활여파가 제일 커서인지 가장 기억에 남더라구. 코로나 덕분에 지인 결혼식도 못가고(ㅜㅜ) 약속도 죄다 취소한 채 집에서 일만 했다. 부트캠프는... 아직 초반이지만 여전히 어렵고 할 이야기가 많긴 해. 전 직장 인턴분이 수료기간 마치고 떠나며 주고 가신 선물. 나 퇴사한지 3개월 지났는데 나까지 챙겨주다니 감동... 편지에서 내가 '퇴사하는 것을 보고 용기를 얻었어요'라고 말해줬다. 전공을 하나 선택하면 평생 그렇게 살 줄 알았는데 내가 퇴사하고 아예 새로운 일을 배우는 걸 보며 여러 가지 도전을 해봐야..

반복문(Loop)은 같거나, 비슷한 코드를 여러 번 실행시켜야 할 때 사용하는 구문이다. 단순 기능을 반복하거나, 특정 조건에 따라 코드를 실행시킬 수 있다. 만약 숫자 1부터 순서대로 2를 더하고, 더한 값에 3을 더하고, 더한 값에 4를 더한다고 생각해보자. 단순히 생각하면 같은 구문을 계속 쓰면 되겠지만, 이런 조건식이 늘어나면 수정을 하거나 오류를 찾는 게 더 어려워진다. let sum = 1; sum = sum + 2; sum = sum + 3; sum = sum + 4; console.log(sum) 이를 위해 사용하는 것이 반복문이다. 위 내용을 아래처럼 풀어 써 보자. let sum = 1; sum = sum + n; // sum과 숫자n의 합을 sum에 대입한다 let n = 2; // ..

문자열(string)은 일상생활에서 확인 가능한 모든 글자의 나열이다. 코드와 의도한 문자열을 구분하기 위해 작은따옴표('')를 사용한다. 문자 하나는 character이며, char이라는 축약어로 부르기도 한다. 문자열의 특징 문자열에 있는 문자 하나하나는 배열에 접근하듯이 접근할 수 있다. 0은, 첫번째 글자, 1은 두번째 글자인 식으로. 만약 문자 수보다 긴 배열로 접근하면 값은 undefined를 나타낸다. 이 방법은 읽을 수만 있고, 변경시킬 수는 없는 방법이다. let word = 'hello world'; console.log(word[0]); // 'h' console.log(word[3]); // 'l' console.log(word[15]); // undefined 문자열은 '+' 연산..

조건문 조건문은 불리언 타입인 true 또는 false로 판명될 수 있도록 어떠한 조건을 판별하는 기준을 만든다. 📌 비교 연산자(Comparison Operators) > : 초과 = : 이상 2) // false, 3이 2보다 큰 것은 참이기 때문에 그값을 반전시킨 false !undefined // 할당되지 않은 값은 false로 취급되는 값. 때문에 이를 반전시키면 -> true !'Hello' // 비어있지 않은 문자열은 모두 true로 취급되는 값. 때문에 이를 반전시키면 -> false 📌 falsy 값 if문에는 실행되지 않는 6가지 falsy 값이 존재한다. false null : 값이 없다는 의미 undefined : 정의되지 않은 값 0 : 숫자 0 NaN : nathe..

페어 프로그래밍 사실 준비할 때 진짜 진짜 많이 떨렸다. 신이시여... 왜 저에게 이런 시련을... 하지만 정말 운 좋게도 페어분을 잘 만났다. 내가 헤매는 부분을 너무 잘 설명해주셨다. 길을 바로 알려주는 게 아닌 방향을 제시해주는 쪽으로. 덕분에 내가 무엇을 모르는지 확실하게 알 수 있었고. 게다가 본인이 공부하실 때 도움받았던 사이트들도 공유주셨다. 함께 문제를 풀어가는 과정에서 오타도 금방 짚고, 무엇을 잘못 적었는지도 알 수 있었음. 페어 프로그래밍은 아무래도 만나는 페어의 영향을 안 받을 수가 없는 시스템이다. 내가 다른 분들 발목잡는건 아닌가, 그런 걱정도 들고. 뭐 그렇다고 지금 걱정하는 것만으로 뭐가 해결되겠나 부족하면 내가 열심히 공부하는 수밖에 없지. 오랜만에 쇼핑 백수 되고나서 한동..