짤방/유머

2년차 좆문가 웹개발자가 공부지도 해준다. (프론트엔드편) (5년전 일게이글 발굴)

3TT2023-07-19목록으로 건너뛰기

<p><a href="https://www.ilbe.com/view/10759247697" target="_blank">https://www.ilbe.com/view/10759247697</a><br> </p><p>방황하는 개발게이들을 발견해서.. 내 옛날모습을 보는거 같더라고..</p><p>마음이 딱해서 글 써본다..</p><p> </p><p>글쓴이 게이는 27살.</p><p>마계살고 마계에 있는 좆소기업에서 포지션 확실한 웹개발자(프론트 백 다함)로 있고.</p><p>세후 230정도 받는다.(2년차)</p><p> </p><p>내 대학교전공은 당연히 콤푸타과고 사실 제일 자신있는 언어는 JAVA였고, 중학생때부터 게임개발자가 꿈이였다.</p><p> </p><p> </p><p>그런데, 시발 왜 웹노가더인가??</p><p>내가 군대에서 통신병으로 전입하고 첫날 소대장이 학교 과 뭐냐 물어봐서 콤푸타과라 하니까</p><p>갑자기 인사과가서 보직변경시키더라. 그리고 전산실에서 html이랑 javascript랑 php배웠음</p><p>부대 내 홈페이지랑 서버 관리하게 됬다.</p><p>거기서 해봤자 뭐 얼마나 하겠냐... 이미 만들어져 있는거에서 수정할거 수정하고 보완하고 그런정도 수준이지.. 걍 퍼블리셔도 아니고 웹디도 아니고</p><p>애매한 수준..? 암튼 그러다 전역하고</p><p> </p><p>병신같은 좆소 쇼핑몰 회사를 들어가서 뭐 똑같이 애매하게 허송세월 보냈다. (2년)</p><p>..</p><p>.</p><p>그러다 이직하고 지금은 완벽한 포지션에서 열심히 일하는 중이다.(아직도 잘 못하지만..)</p><p> </p><p> </p><p>아무튼 뭐, 좆문가가 설명하는거라 니네가 글 읽던 안읽던 자유인데,</p><p>욕할거면 잘못된건 알려주고 그래라..</p><p>나보다 더 잘하는 개발게이들 있을거고 난 이바닥 선배의 조언이라 생각하고 들을테니까.</p><p>틀린거 있음 지적해주고..</p><p> </p><p>우선 웹린이들이 많이 하는 질문을 살펴볼까?</p><p> </p><p> </p><p> </p><p><b>1. 웹개발이 하고싶은데 뭘 공부해야하나?</b></p><p> </p><p>이런애들 특징이, 멋모르고 국비학원다니고 실전투입했다가 얕은지식으로 이도저도 못하는 뜬구름 개발자가 된다.</p><p>나도 한때는 뜬구름개발자였는데...</p><p>뭘 공부해야하는지 묻기전에 뭐가 하고싶은지 알아야된다.</p><p>보통 백앤드, 프론트 이렇게 나누는데</p><p>난 둘 다 하라고 권하고싶다.</p><p>둘 다 해보고, 본인이 편한거 선택하면 되는거고...</p><p>어차피 백을 하려면 프론트도 할줄 알아야되고 프론트를 하려면 백을 할줄 알아야되는거라</p><p>이 둘을 나누는 것 자체가 좀 모순이라 생각이 든다.</p><p> </p><p> </p><p> </p><p><b>2. 자격증 뭐필요해?</b></p><p> </p><p>있으면 좋고 없어도 상관없다.</p><p>본인은 학점 1.7점 병신 쓰레기에다가 자격증 운전면허증 하나다.</p><p>중요한건 본인 기량이 젤 중요하다.</p><p>나랑 학교 같이 다닌 개발자 형은 대학자퇴했고, 5년차 경력프리렌서인데 저번달에 입사하고 초봉 3800이라더라.</p><p>IT회사중에 학벌 이런거 크게 보는 곳 많이 없다. 본인 기량으로 승부하는거야.</p><p>포트폴리오를 보여주고 내가 이정도 한다. 라는걸 어필하고</p><p>회사에서 판단하는거다.</p><p>근데 난.. 제대로 된 포트폴리오는 없고</p><p>여태 그냥 면접에서 말로 조졌다. 이런 프로젝트 해봤고 내가 할수있는건 이거고 못하는건 이거다. 이런식으로..</p><p>어차피 경력이든 신입이던 들어가면 수습기간 있는데, 거기서 얘가 뜬구름인지 진짜인지 판단이 선다.</p><p> </p><p> </p><p><b>3. 무슨언어가 대세야?</b></p><p> </p><p>국내에서는 회사에서 쓰는게 대세다.</p><p>언어라고 해봤자 웹은 뭐 한정되어있는거라, 주로 어떤 프레임워크를 통해서 개발을 하는가</p><p>백앤드는 뭘 쓰는가 그런거겠지만...</p><p> </p><p>비전있는게 뭐냐고 물어본다면,</p><p>현재상황에서는 나는 의심없이 걍 다 몰라도 javascript 하나만 존나 열심히 하면 알아서 다 된다고 말해주고싶다.</p><p> </p><p>엥 그거 젤 기초 아니냐?? 하는 애들 있을텐데, 근데 진짜로 javascript 하나만 해도 프론트 백은 물론이고</p><p>앱, 데스크탑앱 다 만들수 있는 세상이 왔다. 진짜임.</p><p> </p><p> </p><p><b>4. 지금 내 수준이 어느정도인지 모르겠다..</b></p><p> </p><p>그건 3~4년차 이상 개발자들도 똑같은 생각일거다.. 공부하자 ^^</p><p>이쪽은 하루하루 매일같이 공부하는게 일이고 직업이야.</p><p> </p><p> </p><p><b>5. 개발하려면 맥이 ㅆㅅㅌㅊ라던데 나도 앱등이해야됨?</b></p><p> </p><p>난 맥 쓴지 얼마 안됬음. 화면분할이나 매직마우스 이런게 좀 편하긴 해.</p><p>터미널로 존나 간단하게 개발툴 설치나 패키지설치같은거</p><p>ftp필요없이 그냥 접속하고 그런거 보면 확실히 맥이 개발에는 좀 더 좋은 환경이긴 하다.</p><p> </p><p>근데 윈도우던 맥이던 개발하는데 지장은 없다.</p><p>중요한건 모니터가 몇대인가가 중요한거다. ㅇㄱㄹㅇ</p><p> </p><p> </p><p><b>6. 연봉 얼마야?</b></p><p> </p><p>묻지마라...개발자들 은근히 민감해함.</p><p>난 세후 230이라 말했다.</p><p> </p><p> </p><p><b>7. 어떤 회사가 좋아?</b></p><p> </p><p>일단 소통 존나 잘되는곳이여야된다. 피드백 존나 잘해주고,</p><p>윗 사수가 지도 존나 잘해주고 잘 알려주는곳,</p><p>그리고 본인의 포지션이 정확해야된다. 이거시켰다가 저거시켰다가 그러면 안됨.</p><p>사내 스터디같은거도 있는 회사도 있다. (우리회사는 매주 1회 함.)</p><p>그리고 무엇보다, 대표가 새로운것을 잘 받아들여야된다.</p><p> </p><p>이런거 제일 안되는회사가 에이전씨 이런 노가더양성 회사인데,</p><p>이런데 가면 시간낭비다. 존나 발전이 없다.</p><p> </p><p> </p><p><b>8. 스터디그룹 좋아?</b></p><p> </p><p>난 비추천. 그리고 페이스북이나 오픈채팅 이런거로 개발자모임 이런데서 하는거면 더 더욱 비추천이다.</p><p>우리나라 개발자새1끼들 특징이 씨1발 존나 훈장질하는거 좋아함.</p><p>뭐 물어봐도 링크하나 툭 던져주고 읽어보세요</p><p>이딴식으로 어리둥절한 답변을 내놓질 않나, 암튼 아는척 존1나좋아한다. 잘 모르면서도...들어본건 아는식으로 얘기한다.</p><p>그런애들이 모여있다고 생각해봐.</p><p> </p><p>이 글을 읽는 웹린이를 초등학교 1학년이라고 가정을 하자.</p><p>덧셈 뺄셈을 질문을 했어.</p><p>초등학교 1학년한테 씨1발 문제집 예제 하나 던져주고 이해됨? 이러는거랑 똑같아.</p><p>차근차근 알려주는새1끼 거의 없다.</p><p>스터디그룹 나가는애들중에 제대로 된 직장 다니는애들 거의 없음.</p><p>진짜 직장다니는애들은 직장다니느라 스터디 못다님.</p><p> </p><p> </p><p><b>9. 국비교육 다닐까?</b></p><p> </p><p>난 괜찮다고 생각함. 참고로 난 국비교육 이런거 안받고 스스로공부했다.</p><p>근데 국비교육 수준은 대학교보다 못하거나 그 수준임.</p><p>실전 투입될 정도는 아니다. 이말이다.</p><p> </p><p>2달전에 국비교육 이수하고 포트폴리오 올려서 31살 아재가 신입으로 들어왔는데,</p><p>진짜 뭐부터 가르쳐줘야될지 막막하더라...우리가 사용하는 플랫폼 알려주고,</p><p>이걸로 게시판 한번 만들어봐라 했는데,</p><p>자기는 퍼블리셔라 코딩은 힘들다 하대?</p><p> </p><p>와 씨1발 웹디가 본인은 퍼블리셔라고 하는 뜬구름들이 진짜 있다.</p><p>대표한테 그대로 말하고 다음주에 바로 권고사직시킴.</p><p> </p><p>아무튼 국비교육은 정말 기본만 가르쳐 주는 곳이고, 그거 응용해서 다른걸 시도시키려고는 안할거야 아마도...</p><p>국비교육과정에서 아, 이제 뭘 해야하는구나 정도를 느끼는 기회라면 괜찮다고 하는 소리임.</p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p>이정도 말 해줘도 아직도 뭐가 궁금한 웹린이들을 위해서 한 가지 팩폭을 해주자면...</p><p>니네 시발 공부를 할려고하니, 어떻게 해야될지 모르겠고 뭘 질문해야될지 모르겠고 본인이 궁금한것부터 무엇인지 정확하게 말 못하겠지?</p><p>괜찮아 나도 그랬듯이 모든 웹개발자가 겪은 단계야.</p><p> </p><p>지금부터 알려주는것만 그대로 해도. 신입개발자로서는 ㅍㅅㅌㅊ급 수준은 될 거다.</p><p> </p><p>우선, 짤막한 동영상 하나를 보고 시작하자.<br><br><iframe width="560" height="315" src="https://www.youtube.com/embed/TlGMLPoShfU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen=""></iframe><br> </p><p>결국엔 둘 다 해야된다.</p><p>이 동영상 주인공이 말하는 것 처럼 우선은 프론트부터 시작을 해보자.</p><p> </p><p><b>-프론트 기초 다지기-</b></p><p><b>1. html</b><br><br> </p><p>이건 솔직히, 웹개발 모르는사람들도 왠만하면 다 경험이 있을꺼다.</p><p>얘는 웹 문서에서 틀을 잡아주는 녀석이다.</p><p>책에 비유하면, 단순히 삽화없는 그림책이라고 보면 된다.</p><p> </p><p>이걸 공부할때 조심해야할 것은,</p><p>무조건 html5만 봐라.</p><p>xhtml html3 4 버전이 여러가지 있는데,</p><p>다 필요없다. 무조건 html5만 봐라 긴말 안한다.</p><p>요즘엔 모바일이 빼놓을 수 없는 필수적인 요소로 자리잡혀있는데,</p><p>모바일과 데탑 모두 최적화 되어있는 html5를 안쓰고 다른걸 쓴다??</p><p>그런 회사는 존재하지 않는다.</p><p> </p><p>근데 html내에서 사용하는 요소(tag)들이 엄청나게 많은데</p><p>이걸 다 알아야 하는가?</p><p>대답은 no다.</p><p>div img span p ... 등등</p><p>공부하다보면 자연적으로 젤 많이 나오는 녀석들만 알면 된다.</p><p>이런 녀석들을 어느 경우에 적절히 사용해야하는가?</p><p>웹표준이라는 것이 있는데, 사실 중요하진 않지만 어느정도 알면 체계적으로 마크업을 할 수 있을것이다.</p><p>(사실 나도 웹표준 잘 안지킴)</p><p>html공부는 너무 깊게 안해도 된다.</p><p>하루만에 끝나는 공부임.<br> </p><p><b>2. javascript</b><br><br> </p><p>이건 평생을 공부해야하는거라,</p><p>html의 요소와 마찬가지로 예약함수같은건 많이 알면 좋은데 전부 다 알 필요는 없다.</p><p> </p><p>이 녀석은 웹 문서의 동적 역활을 하는 놈이라 보면 되는데,</p><p>웹문서를 보면 무언가 움직이거나 변화가 일어나는것을 볼 수 있다.</p><p>이런걸 동작시키는게 스크립트다.</p><p> </p><p>웹린이의 자세로 젤 중요한건, 기본 제어문 if, for만 정확하게 이해하고 잘 써도 반절은 공부한거라고 보면 된다.</p><p>그리고 요소접근(getElementById) 같은것도 알아야된다.</p><p> </p><p>웹이 쉽다 하는 이유 중, 대표적인 예로 변수선언할때 자료형을 선언 안해서 쉽다고 하는데,</p><p>C언어나 JAVA 등 프로그래밍 기초 언어들을 하다가 웹을 해보면</p><p>와 존나 간단하네?? 하는 이유를 잘 알수있을거다.</p><p> </p><p><b>3. ecmascript(선택)</b></p><p>이건 선택이다.</p><p>근데 필수는 아니고, 나도 지금 공부중에 있다.(사실 몇개만 쓰고 공부 안하는중..)</p><p>자바스크립트 코딩을 할때 좀더 간결하고 파워풀하게 코딩할 수 있는 약간의 트릭(?)이라고 보면 된다.<br><br><b>4. css</b><br> </p><p>캐스캐이딩 스타일 시트의 약자로(스펠링 묻지마 나 영어 잘 못해) 웹문서를 이쁘게 꾸며준다.</p><p>버튼이라던지 폼이나 레이아웃등을 좀더 깔끔하고 이쁘게 바꾸고싶다면</p><p>이걸 해야한다.</p><p>이쁘게 안바꾸고싶어도 기본으로 해야됨.</p><p>이건 스타일시트로 레이아웃을 어떻게 짜야하는가 등</p><p>예제같은걸 많이 찾아봐서</p><p>레이아웃짜는걸 좀 깊게 공부해야된다.</p><p> </p><p>그리고나서는 크로스브라우징에 공부하고...</p><p>단, 애니메이션 이런건 깊게 들어가지마라. 웹린이는 웹린이답게 일단 기본숙지가 중요하다.</p><p>심화는 나중에 실전에서 하면 된다.<br><br><b>5. jquery</b><br> </p><p>자바스크립트에서 좆같았던 것을 좀더 쉽게 사용하게끔 만들어준다.</p><p>자바스크립트 기반으로 만들어진거라</p><p>언어라기보다는 별도의 라이브러리라 생각하면 된다.</p><p> </p><p>이게 왜 필요하냐면,</p><p>요소접근(selector)을 존나 쉽게 가능하게 해주는 큰 장점이 있다.</p><p>홈페이지가서 api를 보면 또 뭔가 존나게 많긴 한데,</p><p>셀렉터만 잘 해도 90프로 한거다.</p><p>나머진 단순 스크립트로 해결해도 문제 없음.</p><p>이걸 가지고 datatable, select, dropdown 이런 다양한 라이브러리를 추가하고 사용할 줄도 알아야됨.</p><p> </p><p><b>6. 넌 프론트엔드 기초에 거의 다가왔다.</b></p><p>여기까지 왔다면, 진짜 프론트엔드 기초가 다져진거라고 해도 된다.</p><p>일베를 켜서 일베 메인을 카피해보자.</p><p>완벽하게는 안되더라도 최대한 비슷하게 카피해서 html문서로 띄울 수 있어야 된다.</p><p>레이아웃짜는거부터 존나 버벅일건데...아무튼 쉬어가는 과정이라고 생각해보고</p><p>굳이 일베 아니더라도 구글메인(이런건 존나쉬우니까 다른거로해봐라)이라던가 그린야갤 등등</p><p>본인이 좋아하는 사이트 그런거도 카피해봐라.</p><p>아니면, 본인 스스로 디자인해서 자신이 직접 사이트 외관을 만들어보는것도 좋다.</p><p>분명 어려울 것인데, 이게 자유자재로 가능하다면, 바로 실전 프론트엔드는 투입해도 전혀 지장 없음.</p><p> </p><p><b>7. javascript framework를 이용해보자.</b><br> </p><p>요즘엔 이거 많이 쓴다.</p><p>왠만하면 하나정도는 써보도록 하자.</p><p> </p><p>일단 대표적으로 react.js(페이스북) vue.js(갓구글) angular.js(어디서만들었는지모름)</p><p>요렇게 삼대장이 있다.</p><p>리엑트를 많이 쓰는 편이긴한데 요새는 뷰 사용자수가 부쩍 늘었다.</p><p>살펴보고 본인이 취향따라서 쓰는걸 추천한다.</p><p>참고로 난 vue.js를 쓰는데, 존나 간편한거같다.</p><p> </p><p>vue.js를 써야하는 이유의 동영상을 한번 보자.<br><iframe width="560" height="315" src="https://www.youtube.com/embed/p1iLqZnZPdo" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen=""></iframe><br> </p><p>웹문서에 스크립트나 스타일시트를 덕지덕지 붙여놔서 좆같이 더러워진 코딩을 간결하게 해주고</p><p>사용자컴포넌트(템플릿)을 보기 쉽고 깔끔하게 더욱 강력하게 만들어주는 마법이다.</p><p>창시자 Evan You가 앵귤러를 쓰다가 "씨바꺼 존나 좆같아서 못써먹겠네!" 하면서  뚝딱 만들어버린게 vue.js다.</p><p> </p><p>내 추천은 vue or react 둘 중에 원하는거 쓰는걸 추천한다.</p><p> </p><p>이 단계부터는 webpack이라는 플랫폼을 쓰게 될 텐데, 좀더 프론트엔드의 전문가가 된 듯한 느낌이 들 거다.<br><br><img class="-up-content -lazy-image" alt="" org-width="1000" org-height="562" src="/t/720/files/attach/new/20230719/377678/11298056330/11490100065/ddc3095ccec18f75a5fa38d6cb5d9399_11490100528.jpg" fetchpriority="high" data="https://ncache.ilbe.com/files/attach/new/20230719/377678/11298056330/11490100065/ddc3095ccec18f75a5fa38d6cb5d9399_11490100528.jpg"><br> </p><p>축하한다 게이야!</p><p>프론트엔드 기본기가 다져졌다</p><p>다음엔 백엔드를 다져서 진로선택을 해야 할 것이다.</p><p> </p><p> </p><p> </p><p> </p><p> </p><p>원래는 한번에 프론트 백 전부 쓰려고 했는데,</p><p>노무 많은 양이라 프론트편과 백편을 나누게 되었다.</p><p>마지막으로 공부하는데 참고하라고 좋은 사이트 몇 군데 알려주고 갈게.</p><p> </p><p>1. <a target="_blank" href="https://poiemaweb.com/">https://poiemaweb.com</a></p><p>누가 만들었는지 몰라도</p><p>기초를 아주 깔끔하게 정리해놨다.</p><p>html, javascript, jquery.... 등등</p><p>이거만 보면서 공부해도 될 것 같다.</p><p> </p><p>2. 생활코딩</p><p><a target="_blank" href="https://opentutorials.org/course/1">https://opentutorials.org/course/1</a></p><p> </p><p>웹개발에 관심있다면, 한번쯤은 들어봤을거다.</p><p>말이 필요없는 김치판 완전강의.</p><p> </p><p>3. 유튜브채널</p><p><a target="_blank" href="https://www.youtube.com/channel/UCtb40EQj2inp8zuaQlLx3iQ">https://www.youtube.com/channel/UCtb40EQj2inp8zuaQlLx3iQ</a></p><p>Andre Madarang이라는 유튜버인데,</p><p>튜토리얼 존나 잘 정리해놨다.</p><p>본인이 자바스크립트 프레임워크를 공부하고싶다.</p><p>하면 얘꺼 채널 들어가보면 vue, react, anguler 등 재생목록별로 잘 정리되어있고,</p><p>심화과정으로 파이어베이스나 라라벨 등등</p><p>뷰 혹은 리엑트랑 같이쓰는방법 뭐 이런거도 있더라...</p><p>근데 아직 웹린이들이 보기에는 난이도가 높은 편이니,</p><p>간단한 튜토리얼만 보는걸 추천한다.</p><p> </p><p> </p><p> </p><p>그럼 열심히 공부해서 똑똑한 프론트엔드 개발자 일게이로 만나자!</p><p> </p><p>다음엔 백엔드에 관해서 정리해줄게 안녕!</p>

일베로0민주화

목록링크

신고

첨부 [1]

• fa243f29b7d25297433f206f1f70235f.jpg84.3KBDownload