0. 내가 일했던 회사나는 솔루션 회사에서 5개월간 일하고, 지난주 퇴사했다. 내가 다녔던 회사는 설립된 지 20년이 넘은 중견 기업으로, 자체 솔루션을 보유하고 있었다. 내가 입사할 당시, 회사는 기존 솔루션을 다른 형태로 발전시키고 새로운 기능을 추가해 더 많은 고객을 유치하려는 프로젝트를 진행 중이었다. 나는 그 프로젝트에 투입되어 5개월 동안 개발 업무를 맡았다.솔루션회사, SI, SM의 차이가 궁금하다면? https://www.youtube.com/watch?v=GG6JVpqpFfM&t=332s&ab_channel=%EA%B2%BD%EC%95%84KyungA 1. Vue와의 첫 만남 처음 회사에 입사했을 때 가장 먼저 마주한 것은 Vue라는 라이브러리였다. Vue를 써본 적이 없었던 나는 처음에..

GDG 상사 ! GDG(Google Developer Gorup)에서 신입사원을 모집했다! 이게 무슨 행사냐면, 하루동안 관련 직무 인턴이 되어서 멘토와 함께 업무 프로세스를 수행하며 배우는 시간이었다. https://festa.io/events/5520 GDG상사 | Festa!Festa에서 당신이 찾는 이벤트를 만나보세요.festa.io[이런 이벤트를 준비했어요] A. GDG상사에서 주어진 과제 : As is -> To be 상사와 함께 팀을 이뤄 3가지 중 하나의 과제를 제미나이를 활용해 GDG상사를 발전시켜주세요 과제1. 지디지마켓 중고 거래 불가 물품을 판별해서 리스크를 줄이자! 과제2. 지디지마켓 중고 거래를 추천해서 전환율을 높이자! 과제3. 지디지마켓에서 알바 신규 비즈니스로 트래픽을 높이..

오늘은 무려 자바스크립트 공식 문서인 MDN에서 금기한 eval 함수에 대해 알아보자  프로그래머스 문제얼마 전 프로그래머스 문제를 풀고 있었다 ( 문제 링크: https://school.programmers.co.kr/learn/courses/30/lessons/120902 )대충 문자열로 식이 주어지면, 그 식을 풀고 값을 리턴하는 코드를 작성해야 했다  어려운 문제는 아니라서 아래와 같이 코드를 작성했고 통과를 했다 내가 작성한 코드const solution=(my_string) => { let a=my_string.split(' ') //공백을 기준으로 문자열을 나눴다 let answer=Number(a[0]); //answer은 배열[0] 값, 즉 첫번째 숫자이다 for(let..

자주 사용하는 tailwind class 이름을 정리해보자이 글에 없는 다른 className을 찾고 싶다면 다음 공식문서에서 확인 할 수 있다: https://tailwindcss.com/또한, 카카오 엔터 기술블로그에서도 tailwind css 사용기에 대해 정리해두었으니, 흥미가 있는 사람들은 한번 들어가서 보길 추천한다: https://fe-developers.kakaoent.com/2022/220303-tailwind-tips/ Tailwind CSS 사용기 | 카카오엔터테인먼트 FE 기술블로그서종만(coze) 생산성을 높이는 일을 좋아합니다. 오늘 1분 걸린 작업이 내일 30초 걸리는 방법을 발견하면 기뻐합니다.fe-developers.kakaoent.com 레이아웃(Layout)contain..

자바스크립트 비구조화 할당(Object Destructuring Assignment)에 대해 알아보겠습니다 다른 언어에도 이와 비슷한 문법은 있습니다 다른 언어에서는 '구조분해 할당(Structuring/Pattern Matching/Destructuring Assignment)' 이라고 부르는데, 둘 다 같은 문법과 기능이며 자바스크립트에서만 특별히 비구조화 할당이라고 부릅니다 비구조화 할당을 쓰지 않고 코딩하기우선 비구조화할당을 사용하지 않고 코딩을 해보겠습니다 다음과 같은 사용자의 이름, 키, 국적을 저장하는 객체가 있다고 가정해봅시다const user = { name: 'clice', height: 183, country: 'Korea' }; 그런다음 사용자의 이름, 키, 국적을 출력하려면 다음과..

프론트엔드 공부를 하면서 Figma 디자인을 직접 하고, 웹 페이지를 만들어야 할 일이 종종 있었다. 문득 내가 하고 있는 일은 프론트 개발이 아니라 웹 퍼블리싱인것 같다는 의문과 현타가 왔다. 내 진로는 프론트엔드 개발자인데, 국비 출신 비율이 높은 웹 퍼블리셔 가 되는것이 아닌지 걱정이 되었다. 웹 퍼블리셔를 무시하는것이 아니라, 나는 개발자가 되고 싶은데 컴퓨터 전공과 멀어지고 있는 기분이 들었다. 프론트엔드 개발자로서 이정표를 확실하게 하기 위해 웹 퍼블리셔와 프론트엔드 개발자가 각각 어떤 일을 하고 그 차이점이 무엇인지에 대해 알아보자 프론트엔드 = 웹 퍼블리셔 ??웹퍼블리셔와 프론트엔드 개발자는 둘 다 웹 사이트 제작 과정에서 중요한 역할을 한다. 많은 국비학원에서 이를 동일시 하는데 업무 범..

HTML을 영단어 외우듯이 암기하고 있는 개발자는 없다. 항상 필요할 때 마다 검색을 해보고, 그때 그때 사용하는 편이다 이번 글에서는 진짜 자주 사용하는데, 정작 헷갈리는 태그들에 대해 정리해보자 반드시 다 외우라는 것이 아니다! 여러번 보면 자연스럽게 익숙해듯이, 이번 기회에 한번 더 보라는 취지의 글이다. CSS-Tricks 에서 제공한 자료에 따르면 가장 유명한(자주 쓰는) HTML 태그는 위와 같다 그럼 진짜 자주 쓰지만, 정작 헷갈릴 때가 많아 항상 검색해보는 태그들에 대해 알아보자 주석이다 가끔 // 나 /* 을 사용하는 경우가 있는데, 이건 Javasciprt 주석이다. 이걸 헷갈리는것 만큼이나 쪽팔린건 없으니까 꼭 기억하자 문서의 구획을 정의한다. 실제 프로젝트에서 CSS와 함께 활용할 ..

생활코딩 책을 보고 실습 🎲 코드 🎲 실행결과 night버튼을 누르면 야간 모드로 day버튼을 누르면 주간 모드로 바뀌는 것을 확인할 수 있다

실습환경: 맥북 m2 air 비주얼 스튜디오 코드 자바 스크립트를 복습하던 중 button 을 만들고 클릭하면 팝업창이 alert 되는 것을 구현하려고 했다 그런데 버튼을 아무리 클릭해도 창이 뜨지 않았다 그래서 코드를 다시 살펴보았다 뭐가 문제였는지 아무리 찾아도 모르겠었는데, 알고보니 onclick(온클릭)을 써야 할 곳에 oneclick(원클릭)이라고 썼다 +이제 보니 onceclick이라고 썼네.. 원쓰릭은 뭐지 🎲 oneclick -> onclick 코드를 수정하고 실행하자 정상적으로 alert 창이 뜨는 것을 볼 수 있다. 난 왜 지금까지 원클릭으로 알고 있었지.. vscode에서 html을 작성할때는 잘못 작성해도 빨간줄이 자주 생기지 않아 오류를 찾기 어렵다ㅜㅜ 이걸 해결하는 방법을 찾아봐..

🎲 문제 상황vs code를 통해 react를 설치하려고 했는데 에러가 '우수수' 쏟아졌다.모두 동일하게npm ERR! code EEISTnpm ERR! syscall mkdir 등등이 떴다일주일 내내 react를 설치하려고 구글링을 해서, 해결 방법 두가지를 찾았다 🎲 해결 방법1. npm modules 삭제가 가능할 때npm install EEXIST: file already exists 에러가 날때 사용할 수도 있는 방법이다 1-1 node_modules 삭제 비주얼 스튜디오 왼쪽에 있는 node_modules 를 삭제(delete)해준다  1-2 npm 재설치아래 코드로 npm을 재설치 해준다npm install npm audit fix  끝!!!! 이면 좋겠지만,,,       나의 경우 n..

HTML을 처음 배울때 Atom을 설치하라고 배웠다 하지만! Atom은 2022년 말 서비스 종료가 되어서 더 이상 사용이 불가능하다 ㅠ.ㅠ 그래서 대체재를 찾다가 VSCode(Visual Studio Code)를 사용하는 방법이 있어서 소개해보려고 한다 방법은 총 3단계로 매우 간단하다 초보자라면 반드시! 꼭! 4번까지 읽어주세요.🎲 1. 비주얼 스튜디오 코드 설치하기https://code.visualstudio.com Visual Studio Code - Code Editing. RedefinedVisual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applicat..

🎲 1. HTML과 CSS HTML과 CSS는 웹 개발에서 중요한 역할을 수행하는 두 가지 언어로, 웹 페이지를 만들고 꾸미는 데에 필수적이다. HTML과 CSS는 서로 협력하여 웹 페이지를 완성시키는데, HTML은 정보의 구조를 결정하고, CSS는 그것을 디자인과 스타일링하여 보기 좋게 만들어준다. HTML이 건물의 구조라면 CSS는 건물의 외벽, 간판이다. 웹 개발자들은 이 두 가지 언어를 함께 사용하여 웹 사이트를 개발하고, 사용자 인터페이스를 디자인한다. 🎲 2. HTML HTML 은 웹문서를 만들 때 쓰는 마크업 언어이다. 홈페이지에 접속하여 이 버튼 저 버튼을 클릭하면 다른 페이지로 옮겨가곤 한다. 이렇게 텍스트 간 이동하는 것을 하이퍼텍스트 라고 한다. HTML은 하이퍼텍스트를 만들기 위해 ..