블로그

코드캠프

Github Copoilot vs 주니어 개발자 (feat. 뭐야 내 직업 돌려줘요)

Github Copilot에 대한 의견이 분분하다는 걸 목격한 코캠, 지난 블로깅에서는 토론에 참여해 의견을 끼워넣어봤습니다.코캠 내부의 토론 결과, '주니어는 대체될 수도 있을 것 같다.' 라는 의견이 많았습니다.이 토론 결과에 동공이 흔들리는 주니어 바로 나야나... (내 직업 못잃어...)코드캠프 선배님들은 거침없이 왜 주니어가 대체 될 수 있는지에 대해 말씀을 시작하고,(그만..그만 말해..)주니어 막냉이는 오랜만에 심장에 떨림이 느껴지기 시작하고. 나 떨고있니..직업이 한순간 백수가 될까 불안에 떨던 저는 마음 먹었습니다.copilot을 직접 사용해보고 정말 날 대체할 수 있나 판단하기로.비교대상인 저는 코드캠프 2년차 주니어 개발자이며 언어는 javascript를 사용하고 있습니다.스택은 코드캠프 스택 + a 정도의 스택을 가지고 있습니다. 자, 그럼 [ 코파일럿 vs 주니어 개발자 ] 비교 가 보 자 구 💡주니어의 Copoilot 사용기1️⃣ 코파일럿 사용 세팅하기 [ Docs ]1 ) 깃허브 settings에 들어갑니다.2) 왼쪽의 사이드 바 'code,planning, and automation' 섹션에서 copilot을 클릭합니다.3) copilot 설정을 해줍니다.* 60일동안은 무료지만, 이후부터는 유료 서비스로 전환됩니다.그 전에 구독 취소하시면 비용을 지불하지 않아도 됩니다.모두 입력 후 설정값을 저장해주시면 됩니다!4) vsCode에 Github Copilot이라는 extension을 설치합니다.5) 설치하고 나면 깃허브 로그인,권한부여 등을 묻는 창이 작게 뜰텐데 로그인과 권한부여에 모두 동의해주시면 됩니다.6) 다 했는데 안될때는?설정 버튼을 눌러 [ 확장 설정 ]을 눌러주세요.위의 버튼을 눌러 setting.json 파일에 들어가 copilot 사용설정을 해주세요! 2️⃣ copilot VS 주니어 개발자⛔️ 본격적으로 주니어 개발자와 copilot의 비교에 앞서, 이 견해는 코드캠프의 주니어 개발자의 의견일 뿐 모두를 대표하지 않습니다. 비교를 위해 주니어 개발자인 저와 코파일럿이 같은 기능을 만들어 보기로 했습니다.기능 : unix 시간을 자바스크립트 Date객체로 변환해 화면에 예쁘게 출력하기[ 주니어 개발자 ]만드는 데 걸린 시간 : 30분직접 코딩시 장단점장점 : 구조를 내 마음대로 그때 그때 바꾸면서 사용할 수 있다.단점 : 모르는 파트가 나오면 구글링 + 구현시간이 꽤나 걸린다.[ 코파일럿 ]위 사진은 코파일럿이 만들어준 기능입니다.너무 신기하게도 제가 직접 작성했던 코드를 러닝해서 비슷하게 진행되면 제가 적었던 코드를 추천 합니다.위의 주석처리 된 함수는 제가 함수 이름만 만들어도 전에 적었던 함수를 추천해줬습니다.그럼 주석으로 한줄씩 만드는 데는 차이가 있을까하여 주석묘사로도 만들어봤는데, 주석도 추천해줍니다.(너무 신기)만드는데 걸린시간 : 5분신기하게도 내가 적은 코드도 러닝을 해서 내 코드를 추천해줌..한글 주석도 된다코파일럿으로 코딩시 장단점장점 : 누구보다 빠르게 코딩이 가능함단점 : 본인 실력이 아니기때문에 코드수정이 필요할 때 난감할 수 있음.기본 틀 자체를 추천하기 때문에 수정에 불리함.그 기능 만들거 아닌데 설레발로 자동완성 해주려고 하니까 불편함. 주니어 개발자의 전반적인 평가평가는 개인적인 견해이기 때문에 주니어 By 주니어지만, 제가 사용해본 코파일럿은 생각보다 똑똑했습니다.언어를 선택할 수 있다고 하길래 당연히 JS 에서만 자동완성이 되는 줄 알았는데, HTML 코드에서도 자동완성을 추천해줍니다.HTML 코드 추천은 제가 위에 적어놓은 코드+내용 바탕으로 추천하는 것 같은데 생각보다 정확합니다.사용하면서 계속 들었던 생각은 '어..이게 되네?' 와 '어..생각보다 똑똑한데...?' 입니다.물론 제가 복잡한 프로젝트내에서 적용하게 아니고, 간단한 기능을 만들었기 때문에 그럴 수 있지만 간단한 함수들을 만드는데는 전혀 무리가 없어보입니다.또한 깃허브에서 만든거라 주석묘사시 영문으로만 입력해야하나 걱정했는데, 한글로도 작성이 가능합니다.코파일럿을 이용해서 회사 내부 템플릿을 만들수도 있겠다는 생각이 드는게, 주석을 자세히 달고 해당 주석을 그대로 입력하면 템플릿을 복사해오지 않을까 싶습니다.이렇게 되면 공통 컴포넌트를 작업하는 시니어는 코파일럿을 만지고, 주니어는 크게 할 일이 없어질 수도 있을 것 같습니다. 결론은 아주 훗날, 라이선스 문제도 해결되고 회사에서 상용화 된다면 정말 주니어 개발자의 입지가 좁아질 수 있을 것 같다는 생각이 들 정도로 잘 됩니다. 그럼, 주니어 개발자는 어떤 걸 더 공부하고 성장해야 코파일럿에게 밀리지 않고 개발자 수명을 연명해 나갈 수 있을까요?(직업을 잃을 순 없잖아요)주니어 개발자가 공부하면 너~무 좋은 기술! 다음 블로그에서 만나보도록 하시죠!모두 코캠과 함께 공부하고 성장하는 개발자가 되어 직업을 잃지 않기로해요. 약속~👍🏻 

웹 개발코파일럿주니어대체GithubCopliot개발자대체프론트엔드백엔드코드캠프

코드캠프

입문자도 가넝한 8주만에 개발자 되는 법

안녕하세요! 실무 코딩부트캠프, 코드캠프입니다 :)날씨가 조금씩 따뜻해지면서 식곤증이 부쩍 늘어나고 있지 않나요?(전지적 컴퓨터 시점)그래서 코드캠프가 눈이 번쩍! 뜨이는(👀) 강의 업데이트 소식을 준비해왔어요!특히 비전공이지만 개발 커리어에 관심이 있는 분들이라면, 주목해주셔도 좋아요 :)코딩을 몰라도(NEW!) 2개월만에 개발자가 되는 '관리형' 코딩 부트캠프인프런에 입성한지 얼마 되지 않았지만 뜨거운 관심과 애정 어린 피드백을 받으며, 더 나은 컨텐츠를 제공하기 위해 코드캠프도 열심히 성장 중인데요. (정말 감사합니다)그 중 사전 기초 지식 없이는 부트캠프 합류가 어려워 신청을 망설였던 분들을 많이 보았어요.그래서 상담 후 등록을 완료해주신 모든 분들께,[시작은 프리캠프], [강력한 CSS], [훈훈한 Javascript] 기초 강의를 무료로 제공합니다!사전 지식을 필요로 하시는 분들은 웹 개발의 기초를 습득하시고사전 지식이 이미 있으신 분들은 기초 내용을 복습하면서 튼튼하게 다져보세요 :)⚠️ 단, 기초 강의 수강 기간은 부트캠프 기간(8주)에 포함되지 않으므로 등록하신 기수의 개강 일정에 맞춰 수강해 주셔야 합니다!(MBTI가 P인 분들)개강 전 기초 강의 수강 계획을 짜기 힘드신 분들은 언제든 코드캠프에 문의해주세요!개강일에 맞춰 수강할 수 있도록 체계적인 시간표를 제공해드리겠습니다 😊👉 2기 일정 : 03.06 - 04.28 (선착순 모집) ▶ 20% 할인 중!👉 3기 일정 : 04.03 - 05.29 (선착순 모집) ▶ 20% 할인 중!

웹 개발웹개발프론트엔드백엔드부트캠프비전공자JavascriptNode.jsReactNext.jsNest.js

코드캠프

채용시장에서 유리한 주니어? [1탄 - 주니어의 기본기 : 프론트엔드 편]

상향 평준화 된 요즘의 채용시장, 주니어 또는 신입 개발자들은 끊임없는 딜레마에 빠집니다.공고에 맞는 스택을 갖췄는데 이직에 실패하거나 취업이 힘든 경험이 있는 주니어 개발자.대체 어느 부분때문에 이직,취업이 어려운 걸까요?더 많은 기술스택이 있는 사람을 채용하는 걸까요? 이에 코드캠프는 채용에 대한 원초적인 질문을 던져 보기로 했습니다.❓ 채용시장에서 조금 더 유리한 주니어 개발자의 역량은 어느 정도일까?❓ 점점 상향 평준화 되어가는 채용 시장, 주니어는 어떤 경쟁력을 갖추고 있어야 할까?주니어 개발자를 양성하는 코드캠프에서 위의 질문은 핫토픽이자, 커리큘럼 개편에 가장 중요하게 반영되는 요소입니다.그만큼 위 질문에서 만큼은 진지하게 고민하고, 다른 기업 CTO분들과 얘기도 많이 나눠보고 여러가지 의견을 반영하는 편입니다.오늘은 위 질문에 대한 코드캠프의 의견을 공유해볼까 합니다!주니어 개발자를 꿈꾸시는 분들께 많은 도움이 되었으면 좋겠습니다. 💡 그래서 뭣이 중헌디[ for. 주니어 ][ ❗️ 아래 내용은 프론트엔드 개발자를 기준으로 한 글 입니다. ] 다수의 기업 CTO분들께서 공통적으로 입을 모아 말씀하셨던 부분은 단연코 ' 주니어의 기본기 ' 였습니다." 부트캠프를 수료하고 만드는 방법을 배워 나오는 주니어는 많은데, 본인 언어나 프레임워크를 깊이 있게 아는 사람이 얼마 없어요.그럼 기업 입장에서는 만드는 방법만 배워 나왔나 싶은거죠. "- 모 기업 CTO분의 말씀 이런 말을 들은 코드캠프는 '주니어의 기본기란 무엇에 대한 그리고 어느 정도 깊이까지를 말하는 걸까?'를 고민해봤고, 그 결과 아래와 같은 답을 도출해보았습니다.웹에대한 이해본인 언어에 대한 이해본인이 사용 중인 프레임워크(혹은 라이브러리)에 대한 이해위의 세가지는 선택이 아니라 '필수'일 정도로 너무 너무 중요한 부분입니다.코드캠프는 저 셋 중에서도 많은 분들이 공부하기 까다롭다, 어렵다 하시는 웹에 대해 간단히 다뤄볼까 합니다.그럼 웹은 어느 정도 깊이로 알고 있어야 할까요? 💡웹, 어느 정도 알아야 해요?프론트엔드 개발자가 웹을 알아야 하는 이유는 굉장히 많습니다.하지만 간단히 요약하자면성능 최적화를 위해디테일한 통신/에러 핸들링을 위해프론트엔드 개발자는 다양한 브라우저를 다루기 때문위와 같이 추려 볼 수 있습니다.그럼 프론트엔드는 웹 중에서도 어떤 부분을 중점으로 먼저 봐야 할까요?물론 다 알면 좋지만, 공부하는데 있어 우선순위는 있습니다!프론트엔드 개발자는 웹의 거시적인 구조와 웹 중에서도 브라우저와 네트워크를 알고 있는게 좋습니다.1️⃣ 웹의 거시적인 구조웹의 거시적인 구조는 우리가 흔히 통신하는 구조를 통틀어 웹 구조라고 합니다.웹 구조에 관련된 그림을 하나 볼까요?거시적인 웹의 구조는 생각보다 별거 없습니다.클라이언트와 서버, 그리고 그 둘을 이어주는 네트워크 이 세 개를 묶어서 거시적인 웹구조로 보시면 됩니다.쉽게 말해 통신 과정이 웹의 구조인 셈이죠.주니어 프론트엔드 개발자는 저 웹 구조 중에서도 브라우저와 네트워크에 관련된 기본기가 상당히 중요합니다. 2️⃣ 브라우저와 네트워크의 이해► 여기서 언급하는 개념은 반드시 따로 블로깅 내용 이외에도 따로 더 깊이 공부해야 하는 개념입니다. ◀︎🔴 브라우저의 기본브라우저를 다루는 프론트엔드 개발자가 브라우저에 대한 이해가 없다면, 프로젝트를 만들 수는 있지만 성능을 고려해 제대로 만들기가 어렵습니다.❓브라우저에서 뭘 공부해야 해요?- 렌더링 과정과 , 성능 최적화에 관련된 공부를 하셔야 합니다.렌더링 과정여러분들은 브라우저가 서버로부터 응답 받은 HTML을 어떤 과정을 거쳐 파싱해주는지 알고 계신가요?위의 과정을 Critical Rendering Path(CRP)라고 합니다.CRP는 여러분들이 작성한 코드를 브라우저에 그려주는 과정을 설명한 개념이기 때문에 반드시 알아야 합니다.그 과정에서 브라우저와 관련된 많은 개념을 배울 수 있습니다.성능 최적화브라우저의 역할이 렌더링이 끝일까요?당연히 그렇지 않습니다.데이터를 요청하는 네트워크(HTTP통신)통신도 하며, 이렇게 받아온 데이터를 캐싱을 도와주는 일도 합니다.받아온 데이터를 캐시에 넣어두면 같은 데이터라면 데이터 요청을 하지 않아도 되기 때문에 화면에 렌더 되는게 빨라집니다.이런 디테일한 부분들이 사용자 경험을 향상 시키고, 사용자 경험은 곧 기업의 매출과도 연결되기 때문에 사소한 부분이라도 최적화는 중요합니다.그럼 어떤 부분의 성능을 최적화해야 하나요?[ HTTP 요청 수 줄이기, 이미지 데이터 최적화, 스크립트 파일 최적화, 캐시 최적화 ]가 최적화의 기본이라고 보시면 됩니다.그럼 여러분들은 해당 부분을 공부하시면 좋겠죠?브라우저에서는 이정도를 기본으로 알고 있는 것이 좋습니다.🔴 네트워크의 기본적인 이해우리가 하고 있는 데이터 통신이 바로 네트워크 통신인 건 모두가 알고 있을 것 입니다.그럼 네트워크에 대한 이해는 너무나도 당연하겠죠?네트워크 부분은 상당한 CS적 지식을 요구하고 양도 굉장히 많은 파트 입니다.따라서 네트워크를 정말 깊게 알게 된다면 정교한 데이터 통신 핸들링도 가능한 시니어 정도의 수준을 갖추게 됩니다.하지만 우리는 주니어에게 필요한 수준이 궁금하니까 주니어 수준에 맞춰 공부해야 할 것들을 알려드리도록 하겠습니다.❓네트워크에서는 뭘 공부해야 하나요?- 네트워크 패킷, HTTP/HTTPS 통신 , HTTP 버전에 따른 지원기능, 네트워크 계층 모델네트워크 패킷브라우저의 주소창에 https://codebootcamp.co.kr/ 을 입력하고 엔터를 누르게 되면 어떤 일이 일어나는지 알고 계신가요?주소창에 위의 주소를 입력하고 엔터를 치게 되면 네트워크 통신이 일어나는데요, 네트워크 통신 과정에서 정보를 담아 왔다갔다 하는 친구가 바로 패킷 입니다.즉, 네트워크 통신의 가장 기초가 네트워크 패킷이 되는 것이죠.따라서 네트워크를 공부한다면 가장 먼저 공부해야 하는 개념입니다.네트워크 계층 모델네트워크 통신이 일어나면 패킷이 왔다갔다 한다고 위에서 말씀을 드렸는데요, 이 패킷이 왔다갔다하는 곳이 바로 계층 모델 입니다.옛날에는 OSI라고 해서 7계층이었지만, 현재는 TCP/IP모델이라고 해서 4계층 모델을 사용하고 있습니다.가장 기초인 패킷이 왔다갔다하는 곳이 바로 이 계층 모델이니 이 또한 반드시 공부해야겠죠?HTTP/HTTPS 통신데이터를 주고받는 과정은 HTTP 통신을 통해 이루어 지는데, HTTP 통신의 결과로 어떤 유형의 데이터를 받을 수 있는지 모두 알고 계신가요?우리가 흔히 봐온 JSON데이터 이외에도 받아올 수 있는 데이터가 있습니다.또한 HTTP header에 넣을 수 있는 데이터 종류는 뭐가 있을까요?위의 질문들은 통신에서 가장 중요한 요청과 응답 관련 개념이기 때문에 반드시 알고 있어야 합니다.요청과 응답 관련 내용을 이해한 상태에서 통신 과정을 공부하시면 가장 좋습니다.HTTP 버전에 따른 지원기능여러분들은 HTTP에도 버전이 있다는 점, 알고 계신가요?현재 지원하는 버전은 1.1, 2, 3 버전이 있는데요, 버전에 따라 지원기능이 다른걸 왜 알아야 하냐!2014년도의 HTTP 버전에서의 GET메소드는 바디가 들어갈 수 없었지만, 1.1 버전 부터는 GET메소드에서도 바디를 지원합니다.이 말은 지원하는 기능에 따라 보내줄 수 있는 데이터의 양과,방법이 달라진다는 것 입니다.  오늘은 주니어라면 이정도는 기본기로 알고 있는 것이 좋다! 하는 개념에 관련해서 블로깅을 해보았는데요.어떠셨나요?어떤 분은 너무 쉬운데? 라고 생각하실 수 있지만, 여기에 적힌 개념은 정말 몰라서는 안된다 하는 내용입니다.따라서 더 많이 공부를 해주셔야 합니다.다음 블로깅에서는 주니어의 기본기에 대해 조금 더 자세히, 개념에 대해 다뤄볼 예정입니다.코캠과 함께 공부 할 싸람~!(없으면 저 혼자 앞질러 갑니다. 오히려 좋아)그럼 우리는 다음 글에서 브라우저에 관한 내용으로 만나요!

웹 개발브라우저네트워크클라이언트서버통신최적화캐시웹구조

코드캠프

Github Copilot, 진짜 개발자 대체가 가능할까?

요즘 Github Copilot에 관해 여러가지 의견들이 충돌하며 의견이 분분하다는 것을 본 코캠.어떤분들은 '미래에 개발자는 Copilot이 대체할 거다' 라는 의견이 있는가 하는 반면, '치와와랑 머핀도 구분 못하는 AI가 어떻게 대체하냐,아직 미흡하다.' 라는 의견도 있었습니다.이런 토론은 개발자로서 굉장히 참을 수 없는 의견대립이죠.그래서 코캠측에서도 슬그머니 의견을 끼워 넣어보기 위해 Github Copilot에 대해 알아보았습니다. 🛠 Github Copoilot?깃허브 코파일럿은 내가 원하는 기능을 주석으로 묘사하면, 묘사에 맞는 기능을 자동으로 완성시켜주는 자동 코딩 시스템입니다.Copilot 빠르게 시작하기1️⃣ 작동방식1. 내가 원하는 기능을 주석으로 묘사합니다.2. 코파일럿 AI가 딥러닝 한 내용을 바탕으로 '대부분 이렇게 쓰던데?' 하는 코드들을 완성합니다. 2️⃣ Github Copoilot의 장단점[ 장점 ]웬만큼 연차가 쌓인 개발자가 아니고서야 라이브 코딩을 하는 개발자는 생각 보다 많이 없습니다.주니어 개발자의 대부분은 다른 사람들이 쓴 코드를 참고하고 긁어와 사용하는 경우가 더 많죠.이런 부분에 있어서는 코파일럿이 도움이 될 수 있습니다.[ 단점 ]코파일럿의 학습이 완벽하지 않기 때문에 개발자의 의도가 정확하게 컴퓨팅 사고를 기반으로 제시되지 않으면, AI는 갈 길을 잃고 의도와 다른 코드를 제시할 수 있습니다.개발자의 의도와 다른 코드는 결국 불필요한 코드를 늘리는 것과 같기 때문에 비효율적일 수 있습니다. 3️⃣ Copoilot의 궁극적인 문제?copoilot의 궁극적 문제는 라이선스 문제가 되지 않을까 싶습니다.코파일럿의 AI가 어떤 라이선스인가를 따지지 않고 학습하기 때문에 뱉어낸 결과물에 제한된 라이선스 코드가 있다면 해당 코파일럿 코드 또한 제한되어야 하는지, 적용한다면 어느 범주까지 적용해야 하는지 애매한 부분이 있다고 합니다.  ❓ 그래서 진짜 개발자 대체가 가능해?여기부터는 코드캠프 일부 개발자들의 의견으로 반박시 여러분들 의견이 맞습니다.😁코드캠프에게 여러분들의 의견을 알려주세요! 코캠측 개발자들의 의견을 정리해보았는데요, 생각보다 코캠 내부에서도 파가 나뉘었습니다!🧑🏻‍💻 백엔드 개발자들Captain( 팀 내 그저 빛을 맡고 계신 9년차 풀스택 개발자 )- 설계를 하는 시니어들은 대체 불가능, 단순 업무를 하는 주니어는 대체 가능.틀을 설계하는 건 인공지능이 발전해도 인간의 창의성까지 가지고 올 수 없는 부분이 있기 때문에 무리라고 생각.Quokka- 비슷한 거 써봤는데 대체 안됨.( 일단 돈을 안냈음. - 무료판 유저 )Otter- 회사의 도입이 대중화 되느냐에 따라 다를 것 같은데, 주니어는 대체 가능하지만 로직의 틀을 짜야 하는 시니어는 대체가 불가하다.Bommy- 상용화 시기가 중요하다고 생각, 과도기동안은 주니어도 대체가 안되지만 상용화 된 이후에는 주니어는 대체가 가능하다고 생각.🧑🏻‍💻 프론트엔드 개발자들Eunny- 주니어, 시니어 모두 대체가 불가하다.공부는 가능하겠지만, 모든 코드는 각자 코드 상황에 따라 다르게 적용되기 때문에 대체 불가.Hoony( 공상과학에 빠져있는 디지털노마드 선두주자 )- 주니어, 시니어 모두 대체가 가능하다. ( 터미네이터와 아이언맨 자비스를 너무 감명 깊게 봄. - AI가 인류를 대체할 수 있다 주의 )시간이 흐를 수록 데이터는 누적될 것이고 대부분의 코드 설계가 가능한 수준까지 올라 갈 수 있을 것, 이를 통해 인건비 절감을 위해 개발자 보다 AI를 선호하는 상황이 생길 수 있다.Jenny- 주니어 정도는 코파일럿으로 대체가 가능하다. 하지만 코파일럿 설계를 해야 하는 엔지니어나 서비스의 큰 틀을 짜야하는 시니어는 대체가 불가능하다. 큰 틀은 언제나 상황에 따라 짜야 하는데 통상적인 부분으로는 커버 불가능함.Gee- 코파일럿이 상용화되어서 많은 사람이 사용하게 된다면 나중에는 코파일럿이 작성한 코드가 트렌드를 반영한 정석 로직으로 여겨지는 날이 올 것 같음. 하지만 상황에 맞게 배치하고 개선하는 작업을 하는 개발자는 반드시 필요하다고 생각. ( 근데 코파일럿 되게 좋은데? ) 코드캠프에서도 총 3가지 의견으로 나뉘었는데요,1. 주니어만 대체가 가능하다.2. 주니어, 시니어 둘 다 대체 가능하다.3. 주니어, 시니어 둘 다 대체 불가능하다.이렇게 총 세가지 의견 중 가장 우세한 의견은 [ 주니어는 대체가 가능하나, 시니어는 불가능하다! ] 입니다. 코드 캠프의 개발자들(일부)은 위와 같이 생각하는데, 여러분들은 어떻게 생각하시나요?여러분들의 의견도 들려주세요!

웹 개발개발자개발자대체GithubCopilotAI기술토론프론트엔드백엔드웹개발시니어개발자주니어개발자

코드캠프

코플소 |코캠러의 프로젝트를 소개합니다!

안녕하세요! 실무 코딩 부트캠프, 코드캠프입니다 :)어쩐지 요즘은 퇴근 시간에도 해가 안 진다 싶더니 오늘이 바로 낮🌞과 밤🌚의 길이가 같다는 ‘춘분’이래요!새 학기가 시작하는 계절이기도 한 지금, 여러분은 어떻게 커리어를 준비하고 계신가요?오늘은 코드캠프의 '코플소:코캠러의 프로젝트를 소개합니다'를 처음 소개하는 날이에요.코플소 시리즈는 코드캠프 코캠러의 다양한 프로젝트를 직접 볼 수 있는 유익한 소식지입니다😊자! 그럼 지금부터 첫번째 프로젝트를 확인해볼까요? 코캠러가 만든 세상에 단 하나뿐인 플랫폼!바로 '댕더(Danger)' 입니다!혹시... 댕더세요? 야나두!🙌기획 의도860만 반려동물 시대를 맞이해 반려견의 Play-Mate를 찾아 '멍라밸'의 질을 높이고 싶었어요!플랫폼을 통해 산책, 간식, 애견카페 탐방 등을 함께 할 친구를 찾는 애견인과 댕댕이를 위한 프로젝트입니다 :) 💫구현 기능✔️ 회원가입 & 초기 프로필 설정웹앱 개발의 기본인 회원가입에서 이메일로 가입할 수 있도록 구현했어요. 본인인증을 위해 가입할 이메일 계정으로 인증 이메일이 전송되어요. 또 동물보호관리시스템을 연동 시켜 반려동물을 등록하고 정보를 검증, 조회할 수 있어요!✔️로그인 페이지 & 비회원 페이지로그인 페이지에서는 회원가입. 비밀번호 재설정, 비회원으로 둘러보기를 차례로 넣어 직관적으로 보이게 만들었어요. 또한, 꼭 회원가입을 하지 않아도 비회원으로 입장해서 등록된 회원들의 강아지를 메인페이지에서 확인할 수 있답니다.(하지만 회원가입 유도를 위해 좋아요 스와이프, 상세 페이지, 댕더패스, 채팅 기능은 비활성화로 설정했답니다!)✔️오늘의 댕댕이 & 상세 페이지좋아요 기능을 적극 활용하여 '오늘의 댕댕이' 페이지를 기획해보았어요! 하루 동안 받은 좋아요 수를 기준으로 12마리까지 나타날 수 있게 구현해 놓고 강아지를 누르면, 댕댕이 상세 정보를 직접 확인할 수 있어요👀추가적인 강아지 사진들과 강아지 이름, 나이, 거리 정보, 설명, 성격, 관심사, 기피 견종까지! 모두 확인할 수 있고 상세페이지에서도 skip, 좋아요 스와이프가 가능하답니다 :)✔️채팅 목록 & 채팅방 페이지.채팅 목록에서는 매칭된 채팅방들을 확인할 수 있고 가장 최근 대화를 나눈 채팅방이 가장 위로 정렬될 수 있게 구현했어요. 또 채팅을 종료하고 싶을 경우 스와이프를 통해 나가기 버튼을 통해 퇴장이 가능해요. 상대 강아지와 채팅이 가능해서 장소와 약속 시간을 공유할 수 있는 기능을 부여해서 유저들이 편리하게 서비스를 이용할 수 있도록 구현했어요 :)🗣️팀 프로젝트 소감(View Point 팀)각자의 과정에서 공부만 하다 처음으로 프론트엔드와 백엔드가 만나는 시간이었던 만큼 긴장도 많이 됐고 서로가 배운 기술로 어떻게 협업을 해야 하는지 감도 잘 오지 않았어요. 하지만 팀원들이 정해지고 팀의 전반적인 룰을 정하기 위해 회의를 진행하거나 기획에 대해 논의를 계속 하면서 하나부터 열까지 협력이 필요하다는 것을 알게 되었습니다!코드캠프는 소수정예로 수강생을 받기 때문에 그만큼 집중 관리를 받을 수 있어서 프로젝트의 퀄리티가 좋은 것 같아요!바쁘고 힘들었던 만큼 가장 뿌듯한 과정이었기도 했습니다! View Point 팀 파이팅!!👊

웹 개발코드캠프팀프로젝트코드캠프후기부트캠프프론트엔드백엔드협업프로젝트플랫폼비전공자개발자

셰리

컴공 졸업생들은 어떤 일을 하고 있을까?

혹시 대학교 전공이 컴퓨터 공학이신 분 있나요? 현재 하시는 일 혹은 하고 싶은 일이 전공과 얼마나 관련 있나요? 일반적으로 컴공과 하면 개발자를 떠올리게 되는데요. 오늘은 컴공과 출신인 인프런 팀원들의 사례를 중심으로 컴공 전공자가 어떤 일을 하고 있는지 살펴보려 합니다! 팔로 팔로 미~ =͟͟͞͞(๑•̀ㅁ•́ฅ✧컴퓨터 공학과 출신인 어떤 분의 고백. 혹시 공감하시는 전공자분 있나요? 🤣 (출처: 트위터 @hau_tumn)Case 1. 개발자몰리 (FE) 🐖처음부터 개발자가 꿈은 아니었어요. 컴퓨터에 아예 관심이 없었고 성적에 맞춰 대학교 원서를 넣다 보니 컴공과로 들어오게 됐습니다. 학점도 좋은 편이었는데, 딱히 전공을 살리고 싶다는 생각도 없었어요. 그러다가 취업 연계 근로로 일하게 된 회사 대표님을 만나면서 생각이 바뀌었습니다.처음엔 엄청 즐겁게 일하시는 모습과, 기술을 공유하고 발표하시는 모습이 인상적이었어요. 그게 다였는데, 근로 이후 공무원을 준비하다 보니 그 대표님 생각이 자꾸 나더라고요. 그때 제가 하고 싶은 일이 뭔지에 대한 고민을 많이 했고, 결국 무작정 대표님을 찾아가서 진로 상담을 했어요. 대표님은 괜찮으면 본인 사무실에서 일해보라고 하셨고, 그때부터 저를 위한 개발 공부를 하게 됐어요. 지금은 개발을 진심으로 좋아하게 됐고요.한 줄 소감 개발은 내가 정말 좋아하는 일!  하루 (BE) 🐷제가 대학 원서를 넣을 당시엔 공대에 들어가면 취업이 잘 된다는 이야기를 많이 들었어요. 그래서 개발의 '개'도 모르는 채로 컴퓨터 공학을 전공으로 선택했어요. 개발에 재미를 느끼기 시작한 건 3학년 때 프로젝트 과목을 많이 수강하면서였는데요.제 성격이 뭔가 안 풀리는 일이 있을 때 악착같이 매달려서 해결해야 하는 스타일이에요. 그래서 뭐 하나 개발하려면 엄청난 삽질(?)을 했거든요. 그런 과정이 재밌게 느껴졌고, 개발자가 되어야겠다는 생각에 확신을 줬던 것 같아요.한 줄 소감 개발자는 나를 성장시켜주는 직업인 것 같아요. Case 2. PO예박 🐨7년 정도 개발을 했는데, 개발이 즐겁지 않고 힘들다는 생각이 들어서 직무를 전환하게 됐어요. 서비스를 만들 때 이미 결정된 것을 전달받는 입장이 아니라 직접 결정에 참여하는 사람이 되고 싶기도 했거든요. IT 서비스를 만들어본 경험을 살릴 수 있는 다른 일을 해보고 싶다고 막연히 생각하다가 PO가 되었습니다.전공 중에 소프트웨어 공학 분야는 IT 기획이나 관리 직무랑 오버랩되는 부분이 있어서 아예 전공과 관련 없는 직무는 아닌 것 같아요. 실제로 개념적인 부분에선 전공 지식이 도움이 되고 있어요.한 줄 소감 어떤 직무든 장단점이 있는데, 개인적인 성향과 역량에 맞춰 더하기/빼기를 해보니 결과가 양수(+)예요. 덕분에 이 일을 계속할 수 있는 것 같아요. Case 3. 콘텐츠 MD앨리스 💝원래 게임을 만들고 싶어서 컴퓨터 공학과에 갔는데, 제가 기대했던 과목들이 없어서 영 재미가 없더라고요. 그러다가 4학년 때 서포터즈 활동을 했던 IT 도서 출판사 대표님이 같이 일해보자고 하셔서 자연스럽게 다른 직무로 커리어를 시작하게 됐어요.IT 콘텐츠 업계에 있다 보니 콘텐츠 MD라는 직무도 저와 잘 맞을 것 같아 지금은 MD로 일하고 있는데요. 전공을 살리면서 재미있는 일을 할 수 있어서 너무 좋아요!한 줄 소감 너무 재밌다! 위즈 🔮저는 개발자가 되고 싶었는데, 제가 꿈꿨던 개발자의 모습과 제 실력 사이의 차이가 생각보다 컸어요. 그리고 그걸 채우려면 끝없는 공부가 필요했는데, 제 성격상 그렇게 끈기 있게 공부할 수 있을까 하는 의문이 생기더라고요.개발 공부를 할 당시에도 인프런으로 강의를 들었는데, 우연히 인프런 광고 메일에 실린 MD 채용 공고를 보게 됐어요. 문득 컴퓨터랑 이야기하는 것보다 사람을 만나는 게 더 적성에 맞을 것 같다는 생각이 들더라고요. 개발자라는 직업은 안 맞지만, IT 업계는 좋아하는 저에게 적합한 일인 것 같았어요. 생각대로 MD가 제 적성에 더 잘 맞는 것 같아요. 미팅할 때 전공 지식이 있으니까 편하기도 하고요.한 줄 소감 행복하면 장땡~ 나는 행복합니다. 직무는 달라도 행복한 컴공 졸업생들! (출처: MBC)전공은 같아도 모두 다른 이야기를 가지고 있다는 게 재밌지 않나요? 컴공과 출신 인프러너가 이 글을 읽고 계신다면, 여러분의 사례도 댓글로 공유해주세요! 🤓

웹 개발컴공졸업취업

셰리

알아두면 좋은 웹 용어! GNB, LNB, SNB, FNB (feat. 인프런)

웹사이트에서 유저의 서비스 탐색을 도와주는 카테고리. 서비스를 찾은 유저가 원하는 것을 쉽게 찾아낼 수 있게 직관적인 UI 구성이 필요한데요. 내비게이션 바라고 불리는 이 카테고리 영역은 위치와 역할에 따라 GNB, LNB, SNB, FNB 등으로 나눌 수 있어요. 인프런 사이트에서 GNB, LNB, SNB, FNB를 찾아볼까요?1. GNB (Global Navigation Bar)웹사이트 전체에 똑같이 적용되는 내비게이션 바이며, 어떤 페이지를 클릭해도 공통으로 쓸 수 있는 메뉴입니다. 보통 웹사이트 최상단에 위치하고 있어 메인 메뉴라고도 불러요. GNB의 Global 역시 웹사이트 모든 영역에 해당된다는 의미를 내포하고 있어요. 인프런 사이트에선 상단의 '강의', '로드맵', '멘토링' 등의 메뉴가 GNB 영역입니다. 2. LNB (Local Navigation Bar)GNB를 클릭하거나 마우스를 호버했을 때 노출되는 하위 메뉴입니다. LNB의 Local은 웹사이트 중 특정 영역으로 한정한다는 의미가 있어, LNB 영역을 서브 메뉴라고도 해요. 인프런 사이트에선 GNB 영역에 마우스를 호버했을 때 LNB가 노출돼요. 3. SNB (Side Navigation Bar)보통 메인 메뉴와 서브 메뉴를 제외한 나머지 메뉴를 SNB라고 해요. 보통 왼쪽이나 오른쪽에 위치하고 있어 Side라고 표현합니다. 인프런에서 GNB 영역의 '강의'나 '로드맵'을 클릭해서 이동했을 때 왼쪽에 SNB가 노출됩니다. 4. FNB (Foot Navigator Bar)웹사이트 가장 하단에 위치하는 메뉴입니다. GNB처럼 사이트 내 모든 페이지에 공통으로 노출되는 메뉴입니다. 가장 하단에 위치하고 있어 Foot이라고 표현하며, 해당 영역을 푸터(Footer)라고도 해요. 보통 기업 정보 등 사이트의 정보가 위치하는 영역이에요. 인프런의 FNB에는 기업 정보, 코드 등록, 고객센터 등이 있어요. 

웹 개발인프런GNBLNBSNBFNBinflearn

wnsgh5049

22.11.23 TIL - 객체 지향 원리 적용 그리고 static

오늘은 휴가를 내고 집에서 <스프링 핵심원리 - 기본편> 강의를 들었다. 생각만큼 많이 듣지는 못했다. 연말에 휴가를 다 써야 하는데 12월 되면 바빠서 못 쓸 것 같아서 다른 사람들 휴가 쓸 때 같이 썼다 1.자바 코드로 회원, 주문, 할인 도메인과 인터페이스 예제를 작성하였다. 이 예제 코드도 좋은 코드지만 SOLID 원칙에 OCP과 DIP 원칙에 위배가 되었다.해결 방법은 각 Service 클래스에 인스턴스 변수를 생성자 인자로 넣어준다. 그리고 AppConfig 파일을 만들어서 그 안에 Service 구현체를 반환해주고 해당 Service를 사용하려는 지점에 AppConfig를 호출하면 AppConfig에서 필요한 인스턴스를 꺼내어 사용할 수 있다. 이렇게 하면 각 Service들은 각자의 역할에만 집중할 수 있으며 확장은 가능하지만 수정은 안되는 코드를 작성해줄 수 있다.어제 객체지향 원리에 5가지 원칙에 대해서 잘 이해가 안 되었지만 코드로 작성해보니 좀 더 이해할 수 있었다. 그리고 Spring을 사용하기 전에 그냥 자바 코드로 의존성 주입을 경험해볼 수 있었다. 2.그리고 static을 왜 사용하는지에 대해서도 알았다. 그 전에는 그냥 코드 따라 칠 때 있길래 생각없이 따라 작성했다. static은 프로그램이 실행될 때 클래스에서 딱 한번 생성된다. 인스턴스가 생성될 때 static 변수는 생성되지 않으며 다른 인스턴스들은 해당 클래스 내부에 있는 static변수를 공유한다.  우연히 다른 사람이 질문한 글을 보았는데 완전 유레카였다. 예전에는 왜 static을 이해하지 못했을까...static 참조: https://www.inflearn.com/questions/240845 내일이나 모래부터 Spring로 프로젝트 시작할 거 같은데 처음 해보는거라 너무 긴장된다... 잘 할 수 있을까...

웹 개발학습일기#스프링핵심원리_기본편

장서윤

[인프런 워밍업 클럽 0기] 2주차 발자국 👣

이번 발자국은 과제 진행 과정을 작성해 볼 예정이다. 목차는 다음과 같다.1. 기능 목록 작성2. 공통 컴포넌트 구현3. 결과물4. 고민했던 부분 ✅️ 1. 기능 목록 작성1. 항목 추가/수정할 수 있다.지출 항목 + 비용을 입력받는다 (조건을 만족할 때까지)지출 항목은 문자열이여야 한다.비용은 숫자여야 한다.지출 항목 + 비용 모두 입력되어야 한다. (공백 제외)  조건을 만족할 경우, 버튼이 enable 된다. 추가/수정을 완료했을 경우, toast 메시지를 띄워준다. 2. 항목 리스트를 보여준다. (테이블 형식)각 항목(row) 마다 수정/삭제 버튼이 존재한다.수정 버튼을 누른 경우[ 기능목록 1. 항목 추가/수정할 수 있다 ] 로 이동한다.삭제 버튼을 누른 경우항목이 삭제되며, toast 메시지를 띄워준다. 총 지출 금액을 보여준다.항목 리스트가 없을 경우, '존재하지 않습니다' 를 보여준다.   3. 모든 항목을 삭제할 수 있다.목록 지우기 버튼을 누른 경우모든 항목이 삭제되며, toast 메시지를 띄워준다. ✅ 2. 공통 컴포넌트 구현MUI와 같은 UI 라이브러리를 쓰지 않고, tailwind css로만 구현할 것이기에, 필요한 컴포넌트는 직접 만들어야한다. 먼저 공통된 디자인을 위해 rounded만을 사용하고자 했다. ( 컴포넌트마다 rounded를 다 다르게 사용하지 않는다)색상은 emerald + slate 만을 최대한 사용했다. 그렇게 해서 필요한 컴포넌트는 다음과 같다. Outlined Input시간을 투자한 부분이다. 기본 html의 input은 굉장히 단순하기에 커스텀이 필요했다.focus 했을 때, label 을 input 박스 위로 가게 하고, 부드러운 애니메이션을 넣고자 했다.Contained Button + Text Button배경을 채운 Contained Button오직 text 만 존재하는 Text ButtonTable기본 table에 css만 추가했다.Toast 메시지 success : 초록색 체크 아이콘추가, 수정, 삭제가 성공적으로 완료되었음을 표시한다. warn : 노란색 경고 아이콘입력값의 유효성검사가 일치하지 않을때 표시한다.  ✅ 3. 결과물 ✅ 4. 고민했던 부분 지출 항목이 문자여야하는데, 이를 어떻게 판별하는가? 이다.애매한 부분이 지출 항목이 "맥북 pro 16" 처럼 오직 문자 type으로 이뤄지지 않고, 여러 type이 같이 존재할 수 있다. 그래서 이걸 어떻게 예외처리 해줄지 고민했었는데, 일단은 지출 항목을 절대 숫자로만 이뤄지지는 않을 것 같아서, isNaN()만을 판별했다. 이 부분은 고민이 더 필요할 것 같다.. toast 메시지의 색상을 어떻게 할 것인가? 이다.상품을 "삭제" 했을 경우, toast 메시지의 아이콘 색상을 고민했었다.빨간색 -> 부정적 의미 -> 삭제와 연관된다! -> 그러나 error 와도 연관됨 -> 사용자 입장에서 "에러가 났다..!" 로 혼동할 수 있음.초록색 -> 삭제가 완료되었다! 에 의미를 둠-> 그러나, 추가, 수정, 삭제도 어쨌든 완료이기에, 다른 기능임에도 아이콘 색상이 같아서 구별이 어렵다는 문제가 존재함.고민 끝에 error와 연관되는 빨간색보다는 초록색으로 가되, "추가", "수정", "삭제" text 를 크고 두껍게 처리해주는 것으로 합의를 보았다!후기UI 라이브러리만 사용하다가, tailwind css로 직접 컴포넌트를 만드니까, 생각보다 시간이 오래 걸렸다. 중간에 계속 애니메이션도 적용된 라이브러리를 사용하고 싶었지만, 이를 css로(비록 tailwind css지만) 직접 완성시켰을때 상당히 뿌듯했다!또한, 기능목록을 제대로 작성한건지 모르겠다. 조금 더 깔끔하게 작성하고 싶은데, 어디까지 자세하게 적어야하는지, ui 부분도 자세하게 적어야하는지(버튼 색깔이 바뀐다거나)를 잘 모르겠다. 더 공부해봐야겠다!  

웹 개발프론트FE워밍업클럽

[냥이와봄] 21주차 (21.11.29 ~ )

✍ 20주차 돌아보기 (제외 목록만 작성) 월: 진진님(사유: 휴식) 화: 열공님(사유: 취침) 수: - 목: 빈털터리제이지님(사유: 회식) 금: 열공님(사유: 약속) 토: 거니님(사유: 약속)            🙆‍♀️ 스터디 멤버 (총 9명) 냥집사, 커피볶는정콩, 열공, boss, 거니, 빈털터리 제이지, 스프링공부를해요, 진진, 취준생G       😨 경고현황 열공님 1회 경고 (10월 경고) 커피볶는정콩님 1회 경고(10.29) 취준생G님 1회 잠수 경고(11.10) 빈털터리제이지님 1회 잠수 경고(11.23)    😱 강퇴현황   💦 특이사항 1. 이대건님의 탈퇴로 인해 생긴 규칙 : 면접 준비, 그 외 다른것 준비한다고 스터디를 나갔다가 다시 참여한다는건 한번이 될지, 두번이 될지 모르는 일이며, 이는 다른 스터디원들을 방해하는 행위로 간주하여 재참여를 못하도록 결정 - 스터디원들에게도 이를 공유함    📖 21주차 커리큘럼 ( 스프링 MVC2편 - 백엔드 웹 개발 활용기술 ) 총 9강 월 : 섹션4. 오류 코드와 메세지 처리2 화 : 섹션4. 오류 코드와 메세지 처리3 수 : 섹션4. 오류 코드와 메세지 처리4 목 : 섹션4. 오류 코드와 메세지 처리5 금 : 섹션4. 오류 코드와 메세지 처리6 토 : 섹션4. Validator 분리1       섹션4. Validator 분리2       섹션4. 정리       섹션5. Bean Validation - 소개           📚 현재 공부 내용 냥집사: JAVA, OOP boss: 스프링 핵심원리 기본편 (김영한) 열공: 자바의 정석, 스프링의 정석, 잔재미코딩 프론트엔드, 잔재미코딩 sql 거니: 토비의 스프링 6장, 스프링 MVC 2편 (김영한) 커피볶는정콩: 스프링 MVC 2편 (김영한), 실전 JPA (김영한), ES6/ 풀스택 유투브 클론 코딩/ css 마스터 (노마드코더), 포트폴리오 (드림코딩), php 기본/ php 객체지향 (정상우), jquery&javascript (애플코딩), vue level2 (캡틴판교) 빈털터리 제이지: SpringBoot, JPA, querydsl, kotlin 스프링공부를해요: Spring, 알고리즘,cs 취준생G: C++, CS(OS, 그래픽스), 코테를 위한 Algorithm 문제풀이(PS) 진진: SpringBoot, JPA

웹 개발

[냥이와봄] 7주차 (21.08.23 ~) - 첫 회고

✍ 6주차 돌아보기 월: 전원완료 화: 전원완료 수: 전원완료 목: 열공님 보류(사유: 병원) 금: 열공님 보류(사유: 병원) 토: kkm님 절반수강, 집가고싶다님 일욜보강           🙆‍♀️ 스터디 멤버 (총 8명) 냥집사, 집가고싶다, kkm, 이대건, 커피볶는정콩, 신규: 열공, boss, 옐로우티거        📖 7주차 커리큘럼 ( 스프링 핵심 원리 - 기본편, 스프링 MVC1편 - 백엔드 웹 개발 핵심 기술 ) 총 9강 월 : 섹션9. 프로토타입 스코프 - 싱글톤 빈과 함께 사용시 Provider로 문제 해결 화 : 섹션9. 웹 스코프 수 : 섹션9. request 스코프 예제 만들기 목 : 섹션9. 스코프와 Provider 금 : 섹션9. 스코프와 프록시 토 : 섹션10. 다음으로       스프링 MVC 1편 섹션1. 웹 서버, 웹 어플리케이션 서버       스프링 MVC 1편 섹션1. 서블릿       스프링 MVC 1편 섹션1. 동시요청 - 멀티쓰레드          🎉 짝짝짝~ [스프링 핵심 원리 - 기본편] 1회 수강 kkm님, 집가고싶다님, 커피볶는정콩님, 냥집사님, 이대건님 축하합니다. 나중에 2회 수강으로 뵙겠습니다. 😏  다섯분은 스터디 첫 느낌을 잊지 않도록 댓글에 짧게 1회 회고를 작성해주세요.    💡 스터디원 진행 사항 기존 스터디원 kkm - 커리큘럼과 동일 (강사 - 김영한님) 커피볶는정콩 - 커리큘럼과 동일 (강사 - 김영한님) 집가고싶다 - 커리큘럼과 동일 (강사 - 김영한님) 이대건 - 스프링 MVC 2편 (강사 - 김영한님) (스터디 들어오실때부터 이미 한번씩 다 들으신분👍) 냥집사 - 스프링 MVC 1편 중반 (강사 - 김영한님)   신규 스터디원 열공 -  스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술 (강사 - 김영한님) 옐로우티거 - 스프링 핵심 원리 (강사 - 김영한님) boss - 스프링 부트 개념과 활용 (강사 - 백기선님)    

웹 개발김영한#spring

crispin

[인프런 워밍업 스터디 클럽 0기_BE] 후기

3주간의 스터디가 끝이났다. 정말 많은 걸 배울 수 있었고, 새로운걸 경험해 볼 수 있었다. 1. 코치님0기 백엔트 코치님은 최태현 코치님이다. 이전 찍으셨던 몇개의 강의(사실 전부..ㅎㅎ) 를 통해 내적 친밀감이 쌓여있었는데스터디 코치님 이라는 이야기를 듣고 꼭 스터디에 참여하고 싶다는 생각이 들었다. 강의를 통해서도 정말 많은걸 알려주시려 하고, 질문도 매우 친절하게 답변해주셨었는데 스터디를 진행하면서도 코치님은 질문 뿐만 아니라특강을 통해서 정말 많은걸 알려주시려고 하는 모습이 정말 대단하다고 느껴졌다.👍 현업에서 일을 하시면서 늦은 시간까지 이어지는 질문에도 친절하게 답변해주시는 모습을 보면서 나도 저런 좋은 영향력을 주위에 끼칠수 있는 개발자가 되고 싶다는 생각이 들었다. 2. 코드리뷰스터디를 처음 시작할때 커리큘럼을 보고 미니 프로젝트를 진행할때 다른 분들과 함께 코드리뷰를 하며 진행하면 어떨까?라는 생각이 들었었다. 할까말까 고민을 정말 많이 했었는데 개인적으로도 코드 리뷰를 해보고 싶었고, 좀 더 이 스터디기간동안 많은걸 배우고 싶어 용기를 내어 함께 진행해 볼 인원을 구했었다. 정말 다행히도 5분의 스터디원 분들이 함께해보자고 하셨고, 결과적으로 너무 만족스러운 시간을 보낼 수 있었다. 내 코드를 다른 사람에게 보여준다는건 지금도 쑥쓰럽긴 하지만 그렇기 때문에 코드 한줄을 작성할때도 정말 많은 생각을 하면서 작성할 수 있었다. 그리고 그 고민했던 내용을 함께 나누면서 정말 많은걸 배울 수 있었다. 다시 한번 함께 미니프로젝트를 진행했던 백엔드 스터디원분들 에게 감사하다는 말을 전해고 싶다.🙇‍♂ 3. 인프런보통의 회사에서 하기 어려운 이런 좋은 영향력을 전파하고 만드는걸 할 수 있다는게 늘 놀랍다. 해커톤이나 개발자 컨퍼런스 후원 기업에 매우 자주 인프런이 있는걸 볼 수 있고, 직접 인프콘 이라는(한번도 가보지 못했다. 나는왜 운이 없는것인가..💧) 큰 컨퍼런스를 열기도 하고. 전반적으로 개발자 생태계에 정말 좋은영향력을 널리 퍼트리고 있는 모습을 보면 정말 대단한 기업이라는 생각이 든다. 생각은 누구나 할 수 있지만 이걸 실천할수 있다는게 참 놀랍다. 이번 스터디도 그렇고 앞으로 더 많은 좋은 영향력을 널리 퍼트리려고 다양한 시도를하고 있는 모습을 보고 있으면 언제가는 인프런에서 일을 꼭 해보고 싶다 라는 생각이 듣다.(자바 개발자 안필요 하신가요💧) 4. 0기앞으로 이 워밍업 클럽이 0기에서 멈추는것이 아니라 1기 2기 쭉쭉 더 많은 사람들에게 좋은 경험이 될 수 있도록커져갔으면 좋겠다. 다음에 더 좋은 스터디가 열린다면 주변에 적극 추천해주고, 나도 다시 한번 참여해봐야겠다. 5. 마무리좋은 기회를 만들어주신 인프런 관계자 분들에게 정말 감사드린다. 특히 스터디 운영에 대해 이런저런 공지와 궁금증을해결해주신 셰리 에게 감사의 인사를 전하고 싶다. 더 많은걸 알려주시려 했던 최태현코치님 그리고 함께 했던 모든 백엔드 스터디 원 분들에게도 다시 한번 감사하다는 인사를 전하고 싶다. 주저리주저리 말이 많아졌는데, 혹시라도 미래에 있을 1기 신청을 고민하며 이 글을 보고 있다면 당장 신청 하라고 적극 권해 주고 싶다.

웹 개발인프런인프런워밍업클럽스터디0기백엔드

코딩웍스(Coding Works)

[필독] 웹디자인 기능사 실기시험 학습을 처음 시작하는 분들

안녕하세요. 코딩웍스입니다.웹디자인 기능사 실기시험 학습을 처음 시작하는 분들이 자주 질문하시는 것들이 있어서 블로그에 정리하려고 합니다.웹디자인 기능사 실기시험은 실무를 위한 학습과는 거리가 있기 때문에 시험에 꼭! 필요한 부분만 준비하고 학습하셔야 합니다. 1) 비주얼 스튜디오 코드(Visual Studio Code) 사용법 및 환경설정 웹디자인 기능사 실기시험 학습을 위해 1~4번 중에서 1)번과 2)번만 학습하시면 됩니다.2)번은 모두 확실히 학습합니다.1)번에서는 비주얼 스튜디오 코드 사용법은 모두 확실히 학습합니다. 비주얼 스튜디오 코드 환경설정에서 자동저장 기능 활성화 하기는 체크하고 연습하세요.환경설정 부분은 하실 필요없습니다. 왜냐면 실기 시험장에 가면 초기화 되어 있어서 환경설정을 다시 해야 합니다. 만약 환경설정을 하고 싶다면 단축키 설정 정도만 하시면 됩니다. 실기 시험장에서 단축키 설정은 몇개 안되니 1~2분이면 충분하니까 작업 속도를 위해서 단축키 설정은 하시면 좋습니다.웹디자인 기능사 실기시험 학습을 위해 3)번과 4번)은 학습하실 필요 없습니다. 시험장은 인터넷이 안되는 환경이므로 익스텐션을 설치할 수 없으니 익스텐션을 사용해서 학습하시면 실기시험과 환경이 달라서 혼란스러울 수 있습니다. 3)번은 나중에 시험 끝나고 퍼블리싱을 더 학습해야 할 경우 학습합니다. 

웹 개발웹디자인기능사실기시험

holi

[우당탕탕 HTTP] 2. IP

가볍게 넘겨왔던 http에 대해 파헤쳐보자! [우당탕탕 HTTP] 저번 블로그에서 인터넷에서는 컴퓨터 끼리 정해진 TCP/IP라는 통신 규약을 통해 통신한다고 했습니다.이번에는 TCP와 IP중 더 하위 프로토콜인 IP에 대해 알아보겠습니다.IP란?IP(Internet Protocol)이란, 패킷 교환 네트워크에서 정보를 송신하고 수신하는 데 사용하는 정보 위주의 규약IP는 패킷 이라는 통신 단위로 정보를 전달하기로 한 규약입니다.따라서, IP는패킷이라는 통신 단위를 교환하는 네트워크에서 정보를 주고 받는 데 사용하는 규약이라고 할 수 있습니다.IP패킷에는 정말 다양한 정보들이 들어있습니다.이 IP패킷 안에 출발,목적지의 IP 주소가 담겨있고 데이터 등이 담겨있습니다.우리가 인터넷을 통해 다른 컴퓨터와 통신할 때,이 IP패킷을 전달함으로써 목적지를 찾아 데이터를 전송할 수 있는 것입니다. 우리가 네이버 서버로 접근하는 모습을 보면우리의 IP패킷에 우리의 IP주소를 담고 네이버 서버의 IP 주소를 담아서 데이터를 전송합니다.이 때, 컴퓨터 끼리의 연결인 인터넷을 통해 IP패킷을 전달해가면서 목적지인 네이버의 서버에 접근할 수 있는 것입니다.택배를 예로 들면 물건 판매사에서 송장을 통해 우리에게 까지 택배로 전달 되는데,여기서 송장이 IP패킷의 역할을 한다고 볼 수 있고택배 배송 조회를 하면 보이는 중간 중간의 무슨HUB, 무슨SUB가 인터넷 역할을 한다고 볼 수 있습니다. 그런데, 이 IP에는 한계들이 존재합니다.우리는 택배 배송 조회를 하면 내 택배가 어디쯤에 있는지 다 알 수 있습니다.그런데, IP 패킷은 어디쯤에 있는지 알 수 없습니다.그 한계를 살펴보면,비연결성패킷을 받을 대상이 없거나 서비스가 불가능한 상태여도 패킷을 전송한다.비신뢰성중간에 패킷이 손상 or 소실이 될 수 있다.패킷을 여러번 전송할 때, 그 순서가 보장이 되지 않을 수 있다.같은 패킷을 중복으로 전달 할 수 있다.프로그램 구분X같은 IP 주소를 사용하는 서버에서 통신하는 애플리케이션이 둘 이상 일 수 있다.그렇다면, 이러한 한계들은 어떻게 해결을 할 수 있을까요??이것은 IP의 상위 프로토콜인 TCP 프로토콜을 통해 가능합니다.TCP프로토콜은 다음번에 알아보도록 하겠습니다. +추가 정보 HTTP에 대해 더 자세히 알기 위해서는 OSI 7계층과 인터넷 프로토콜 스위트에 대해서도 알아야 합니다.기회가 된다면 나중에 한번 자세히 다뤄보도록 하겠습니다.    

웹 개발httpprotocol프로토콜IP우당탕탕holi

holi

[우당탕탕 HTTP] 0. HTTP (맛보기)

가볍게 넘겨왔던 http 에 대해 파헤쳐보자! [우당탕탕 HTTP] 먼저 http를 wiki에서 한 줄만 가져왔습니다.HTTP는 클라이언트와 서버 사이에 이루어지는 요청/응답(request/response) 프로토콜이다.여기서 프로토콜이란 통신 규약인데, 즉 약속 이라는 뜻입니다.클라이언트와 서버 사이에 HTTP라는 미리 정해진 약속을 통해 요청과 응답을 나눈다는 것입니다.가령, 우리(클라이언트)가 은행의 은행원(서버)과 요청/응답이 필요할 때, 우리는 일련의 약속을 통해은행원에게 요청을 합니다.은행에 우리가 방문한다.은행에서 번호표를 뽑고 순서를 기다린다.번호판을 확인하고 일치하면 창구로 간다.상담을 나눈다.즉, 이런 일련의 약속이 웹 상에서 정해진 것이 바로 HTTP인 것입니다.아무래도 기술이 진화를 하다 보면 새로 생겨나는 여러 기능과 개념들이 있기 마련이고그에 따라 HTTP 프로토콜도 거듭하여 진화가 있었습니다.초기의 웹 생태에서는 하이퍼 텍스트 문서만 주고 받았고그에 맞은 통신 규약이 있었습니다.그러다 이미지나 비디오 같은 데이터도 주고 받고 싶어지고주고 받으려면 아무래도 새로운 약속들이 필요해졌습니다.그렇게 진화를 해온 것이죠.현재의 http를 살펴보면TCP/IP 등의 기반 위에 HTTP가 있고 이 HTTP를 기반으로 HTML, CSS, JavaScript와 같은 파일들을요청/응답한다고 볼 수 있습니다.그렇다면 TCP .. UDP .. 는 무엇일까요?그것은 앞으로 알아보도록 하겠습니다.오늘은 HTTP를 맛보기로 알아보았습니다.앞으로 HTTP를 더 깊게 이해하기 위해 그 기반들을 알아보고 나서HTTP를 좀 더 파보도록 하겠습니다.

웹 개발httpprotocol프로토콜우당탕탕holi