2024/03 8

자바스크립트 - 실행 컨텍스트, This, 바인딩

실행 컨텍스트(Execution Context) 실행 컨텍스트란 코드가 실행 될 때 환경 정보들을 모아둔 객체입니다 실행 컨텍스트는 Last-In-First-Out인 Call Stack에 쌓아 올려지며 실행이 완료되면 빠지게 됩니다 코드의 환경과 순서를 보장합니다 Active Context: 전역 -> A 함수 -> B 함수 -> A 함수 Acitve한 컨텍스트는 콜스택 맨 위의 컨텍스트 입니다 현재 실행 컨텍스트에서 필요한 값을 찾고 없으면 하위 컨텍스트로 이동하며 전역 실행 컨텍스트까지도 찾지 못하면 에러를 발생시킵니다 실행 컨텍스트는 스택에서 제거되도 메모리에서 바로 제거되지 않는데, 추후에 참고해야 할 수도 있기 때문입니다 Garbage Collector가 지켜보다가 더 이상 사용되지 않으면 자동..

자바스크립트 2024.03.29

자바스크립트 - 함수, 순수함수, 일급함수, 호이스팅, var 호이스팅

앞선 글에서 변수에 대해서 알아보았습니다 이번에는 좀 더 많은 일을 할 수 있게 해주는 함수에 대해 알아보도록 하겠습니다 함수란? 어떤 목적을 위한 일을 수행하는 코드의 집합입니다 함수를 쓰는 이유 코드의 재사용성: 동일한 함수를 여러 곳에서 호출하여 사용할 수 있습니다 모듈화: 프로그램을 더 작은 단위로 나눠서 복잡성을 줄일 수 있습니다 유지보수성: 유지보수를 하기 용이합니다 코드의 가독성: 함수의 이름을 보고 기능을 직관적으로 이해할 수 있습니다 테스트 용이성: 개별 테스트를 하기 용이합니다 함수 작성 방법 함수는 외부에서 변수를 넘겨받아 함수 내부에서 수행되는 연산에 사용할 수 있습니다 이때 넘겨 받는 변수를 매개 변수, 혹은 인자라고 합니다 더하기 함수라면 두개의 숫자를 인자로 넘겨받아 더하기 연..

자바스크립트 2024.03.29

자바스크립트 - 변수, var, const, let, 선언, 할당, 초기화, 렉시컬 스코프, 스코프 체인

앞서 여러 프로젝트를 진행한 결과 프론트엔드 웹 개발자로 진로를 정했고, 나에게 없는 기초를 튼튼히 다져야겠다는 생각이 들어 [SK플래닛] 웹 풀스택 개발자 과정 ASAC과 함께 자바스크립트, 리액트, 스프링부트 공부과정을 블로그에 작성하기로 결심했다. 풀스택이지만, 어느 한쪽을 얕게 공부하지 않는 빡센 커리큘럼이라고 한다. 4개월 동안 교육을 듣고 블로그에 작성하는 이 시간들을 통해 유의미한 결과가 도출되기를!!😎 자바스크립트란? 자바스크립트는 웹페이지에 생동감을 불어넣기 위해 만들어진 프로그래밍 언어 자바스크립트의 역할은 웹페이지에서 다양한 기능을 구현하는 것입니다 예시로 애니메이션 동작, 팝업 띄우기, 사용자에게 문자 입력을 받기 등이 있습니다 *자바와는 아무런 연관이 없습니다^^ 자바스크립트는 미..

자바스크립트 2024.03.28

[유데미X스나이퍼팩토리] 앱/웹 개발자 인턴형 프로그램 : 웹 개발 8주차

🎉두 번째 프로젝트: 스팩스페이스의 스팩로그 => 개발자들이 다양한 분야의 프로젝트와 로그를 공유할 수 있고 정보를 수집할 수 있는 커뮤니티 서비스 🎆포켓베이스의 비밀번호 변경 기능을 추가로 구현했다. 포켓베이스 측에서 메일을 발송해주기 때문에 손쉽게 비밀번호를 변경할 수 있다! Checkbox의 디자인을 동그라미로 대체하기 위해 컴포넌트를 직접 만들었다. 빈 동그라미와 채워진 동그라미 두개의 이미지를 보여지게 끔 했다. 자체 컴포넌트를 React-hook-form에 연결하기 위해서는 Controller를 사용해야 했다. 🎈KPT 란? Keep 현재 만족하고 있는 부분 계속 이어갔으면 하는 부분 Problem 불편하게 느끼는 부분 개선이 필요하다고 생각되는 부분 Try Problem에 대한 해결책 다음 ..

[유데미X스나이퍼팩토리] 앱/웹 개발자 인턴형 프로그램 : 웹 개발 7주차

🎉두 번째 프로젝트: 스팩스페이스의 스팩로그 => 개발자들이 다양한 분야의 프로젝트와 로그를 공유할 수 있고 정보를 수집할 수 있는 커뮤니티 서비스 🎆Gmail을 통해 SMTP설정을 처음 해봤다! 근데 구글에서 한번 비정상적 활동이라며 계정을 막았다. 그래서 문의했더니 다행히 금방 계정을 풀어주었다. 완성된 디자인킷을 활용하여 기능만 있는 페이지에 디자인을 추가했다. 디자인킷으로 인해 여러 사람이 각각 다른 기능을 구현해도 페이지들 간에 통일성이 있어서 좋았다. 그리고 Recoil을 사용하여 상태관리를 하게 됐다. 다음주면 벌써 프로그램의 끝이다. 더 많은 기능을 구현하지 못한 것이 아쉽지만, 잘 마무리 할 수 있었으면 좋겠다!! 🎈KPT 란? Keep 현재 만족하고 있는 부분 계속 이어갔으면 하는 부분..

[유데미X스나이퍼팩토리] 앱/웹 개발자 인턴형 프로그램 : 웹 개발 6주차

🎉두 번째 프로젝트: 스팩스페이스의 스팩로그 => 개발자들이 다양한 분야의 프로젝트와 로그를 공유할 수 있고 정보를 수집할 수 있는 커뮤니티 서비스 🎆회원가입, 로그인 파트를 맡게 되었다! React-hook-form에 대해 처음 접해서 공부하면서 프로젝트에 적용하고 있다. 디자인킷을 따로 개발해주시는 분이 계시기에 디자인을 하나도 넣지않고 기능만 구현하고 추후에 디자인을 붙일 계획인데, 기능에 먼저 집중할 수 있어서 기능을 먼저 구현하고 디자인을 붙이는 게 좋은 개발 방식인 것 같다. 🎈KPT 란? Keep 현재 만족하고 있는 부분 계속 이어갔으면 하는 부분 Problem 불편하게 느끼는 부분 개선이 필요하다고 생각되는 부분 Try Problem에 대한 해결책 다음 회고 때 판별 가능한 것 당장 실행 ..

[유데미X스나이퍼팩토리] 앱/웹 개발자 인턴형 프로그램 : 웹 개발 5주차

🎉두 번째 프로젝트: 스팩스페이스의 스팩로그 => 개발자들이 다양한 분야의 프로젝트와 로그를 공유할 수 있고 정보를 수집할 수 있는 커뮤니티 서비스 🎆처음 사용하는 기술스택들이 있어서 공부가 더 필요할 것 같다. 프론트엔드는 참 다양한 선택지가 있는 것 같다. 공부한 후에는 기술들을 적재적소에 잘 활용하는 개발자가 되기를!! 또한 API를 작성하는 과정에서 많이 배웠다😄 🎈KPT 란? Keep 현재 만족하고 있는 부분 계속 이어갔으면 하는 부분 Problem 불편하게 느끼는 부분 개선이 필요하다고 생각되는 부분 Try Problem에 대한 해결책 다음 회고 때 판별 가능한 것 당장 실행 가능한 것 🎥5주차 회고 본 후기는 유데미-스나이퍼팩토리 앱/웹 개발자 인턴형 프로그램 학습 일지 후기로 작성 되었습니..

[유데미X스나이퍼팩토리] 앱/웹 개발자 인턴형 프로그램 : 웹 개발 4주차

🎉두 번째 프로젝트: 스팩스페이스의 스팩로그 => 개발자들이 다양한 분야의 프로젝트와 로그를 공유할 수 있고 정보를 수집할 수 있는 커뮤니티 서비스 🎆이번에도 4명의 개발자들과 여러명의 디자이너분들과 함께한다. 이번에는 어떤 프로젝트가 기다리고 있을까~? 기대가 된다. 두근두근!! 🎈KPT 란? Keep 현재 만족하고 있는 부분 계속 이어갔으면 하는 부분 Problem 불편하게 느끼는 부분 개선이 필요하다고 생각되는 부분 Try Problem에 대한 해결책 다음 회고 때 판별 가능한 것 당장 실행 가능한 것 🎥4주차 회고 본 후기는 유데미-스나이퍼팩토리 앱/웹 개발자 인턴형 프로그램 학습 일지 후기로 작성 되었습니다. #유데미 #udemy #스나이퍼팩토리 #웅진씽크빅 #인사이드아웃 #IT개발 #개발자부트..