profile
21c Carpenter
태그 목록
전체보기 (130)JavaScript(44)javascript30(30)react native(17)React(13)typescript(10)CSS(6)WeCode(5)git(5)error(5)react.js(4)jest(3)test(3)fixed(3)github(3)login(2)python(2)cloning(2)Auth(2)signup(2)array method(2)Spread Syntax(2)video(2)bluetooth(2)westagram(2)절대경로(2)debug(2)class(2)redux(2)project(2)styled component(2)linux(2)testing(2)CallStack(2)정규표현식(2)absolute(2)regular expression(2)Xcode(2)addEventListener(2)background(2)styled components(2)regex(2)html(2)build(2)cors(1)인가(1)increment operator(1)position(1)sticky(1)Root(1)immutablility(1)uuid(1)fork repo update(1)data-속성(1)requiring unknown module undefined(1)promise(1)실습(1)sql(1)import(1)중앙정렬(1)splice 음수 인자(1)Email Auth(1)github 실무(1)getBy(1)terminal(1)불변성(1)Center(1)type change(1)Airbnb Guide(1)public(1)clock(1)npm(1)instance(1)relative(1)서명(1)compile(1)Component Structure(1)Restful(1)Primitive Type(1)rebase(1)catch(1)로딩화면(1)refresh-token(1)List(1)http(1)동적 라우팅(1)propagation(1)에러핸들링(1)리액트(1)Absolute Path(1)Cross-Origin Resource Sharing(1)무한스크롤(1)extending style(1)REST(1)코어자바스크립트(1)heap(1)movemove(1)object 순회하기(1)Location(1)lsof(1)Request(1)Response(1)once(1)전개구문(1)lifecycle(1)slider(1)document.documentElement(1)oAuth(1)loading indicator(1)유사배열(1)styleWe(1)navigator(1)형변환(1)getBoundingClientRect(1)SpeechAPI(1)이메일인증(1)shiftKey(1)Module(1)비밀번호초기화(1)email multi choice(1)router(1)고유식별자(1)float(1)이미지경로(1)webcam(1)Firebase(1)class field(1)null(1)Prototype(1)useEffect(1)cue(1)scrollLeft(1)img(1)match(1)Fetch API(1)Transpiler(1)throw(1)package lock.json(1)package.json(1)async(1)parameter(1)전자서명(1)Android BLE(1)MAC Address(1)Flex(1)&&(1)version mismatch(1)EventLoop(1)stringToNumber(1)textConent(1)authentification(1)nodeList(1)e.preventDefault()(1)definite assignment assertion(1)git flow(1)Reference Type(1)bootcamp(1)access token(1)Generic(1)클론프로젝트(1)classList(1)당근마켓(1)공식문서(1)REST API(1)redux-toolkit(1)speechRecognition(1)scroll(1)countdown(1)const(1)let(1)class101(1)text-shawdow(1)NODE_PATH(1)회원가입(1)key stretching(1)통신지연(1)find module package(1)DefaultRootState(1)bcrypt(1)react-native-ble-plx(1)Custom Fonts(1)두더지잡기(1)extend(1)auto scroll(1)key(1)Signin(1)instagram(1)독서후기(1)callback Hell(1)TypeError: Converting circular structure to JSON(1)clickevent(1)local storage(1)authorization(1)개발자도구(1)NavigationConatainer(1)복수선택(1)useMemo(1)useRef(1)inline block(1)setInterval(1)navigation(1)history(1)event bubbling(1)격투 게임기 기술(1)secure token(1)signature(1)stringify()(1)dev tool(1)semantic(1)clone(1)hook(1)useCallback(1)React Structure(1)DevTools(1)Context API(1)Expo(1)reduce(1)Single Thread(1)font(1)EventListener(1)innerText(1)key sequence(1)watchPosition(1)error handling(1)block(1)작성중(1)styleshare(1)inline(1)InnerHTML(1)strict mode(1)type check(1)mock(1)음성인식(1)array(1)chatting(1)queryBy(1)extends(1)super(1)프로젝트(1)react typescript(1)spa(1)geolocation(1)숫자야구 게임(1)nosql(1)node_modules(1)custom error(1)db(1)크롬 개발자도구(1)speech synthesis API(1)코드설명(1)slice(1)RDBMS(1)아날로그 시계(1)best practice(1)salting(1)Documentation(1)babel(1)event delegation(1)error class(1)HTMLCollection(1)Database(1)Map(1)Apple(1)Math.random(1)BLE(1)Token(1)regexp(1)kill port(1)react-native-safe-area-context(1)연동로그인(1)import not working(1)portfolio(1)react-native-gifted-chat(1)Reactm(1)IoT(1)different wifi(1)react-native-ble-manager(1)위코드(1)순환참조(1)pageX(1)playbackRate(1)mobx(1)private(1)device(1)mockdata(1)audio(1)stash(1)speech(1)capture(1)global theme(1)react router(1)static(1)scope(1)Pagenation(1)canvas(1)주석(1)Comment(1)JSDoc(1)Mocking(1)객체 불변성(1)flex panel(1)랜덤숫자뽑기(1)argument(1)로그인(1)Cheat Sheet(1)undefined(1)인증(1)mixin(1)

"Module System" in Typescript

sandbox 환경에서 작동하는 javascript 파일이고, public에 어떤 value를 노출import문과 export문을 포함하는 일반적인 javascript 파일변수 앞에 delcare를 붙이면, ts compiler에게 이 값은 런타임에 존재하고, shap

2021년 7월 6일
·
0개의 댓글

[책 요약] 코어 자바스크립트

(1) primitive(원시형) : number, string, boolean, null, undefined ... (2) reference(참조형) : object, Array, Function, Date, RegExp...원시형은 값이 담긴 주소값을 바로 복제

2021년 4월 14일
·
0개의 댓글
post-thumbnail

특정 영역 이외의 클릭(event) 인식(Listen)

여기서 우상단의 프로파일 이미지를 클릭하면 아래처럼 메뉴박스가 보여지고,여기서 다시, 해당 우상단 프로파일 이미지 이외 영역을 클릭하면 메뉴박스가 사라지도록 하고자 함if(this == 우상단 프로파일 이미지 element)으로 클릭된 element와 그렇지 않은 el

2021년 1월 21일
·
0개의 댓글
post-thumbnail

<Javascript> Object를 Array처럼 순회하기

기본적으로 Array는 순서가 있는 데이터가 인덱스 순서에 따라 안에 정렬되어 있어, for (var i; i &lt; arrary.length ; i++) 식으로 순회하거나 .forEach, .map, .find, .reduce 등 유용한 기능을 활용가능하다.그

2021년 1월 14일
·
0개의 댓글
post-thumbnail

Javascript - ++num과 num++의 차이

위의 2번째 줄, num ++는 아래와 동일하다.num = num + 1증가 연산자는 반복문(for) 등에서 변수에 1만 더한 값을 재할당 경우 간소하게 쓰기 위해 자주 사용된다.&lt;1번 경우>&lt;2번 경우>위의 경우에는 ++가 변수 앞에 오느나, 뒤에 오느냐에

2021년 1월 14일
·
0개의 댓글
post-thumbnail

Javascript - 최소 ~ 최대값 사이의 랜덤 숫자 뽑기

랜덤한 숫자를 가져오는 기능은 프로그램 개발에서 매우 자주 사용되는 기능임따라서, javascript는 built-in 함수로 포함되어 있음(Math.random())구글 서치를 하면 그냥 아래와 같은 방식을 공식처럼 알려주고 있다.생각보다 길지 않고, 어렵지 않다.

2021년 1월 14일
·
0개의 댓글

값 없음- null vs undefined

'값이 없음'을 의미primitive typeundefined는 type이면서 값이지만, null의 type은 object임null은 명시적으로 '='를 통해 null로 할당

2021년 1월 8일
·
0개의 댓글
post-thumbnail

Javascript에서의 작동원리 - call stack 외

single thread = single call stack = 한 번에 한 가지 수행가능 = 동기적 수행함수의 호출을 기록하는 자료구조기본적으로 우리가 프로그램 안에서 위치한 곳오브젝트(객체)들은 힙 내부에 할당힙은 거의 구조화되지 않은 영역(unstructured)

2021년 1월 8일
·
0개의 댓글

Class - extends, super

: Class는 개별 Object를 instace하기 위한 하나의 틀(고정 형식) : 공통된 속성과 method의 효율적인 재사용을 위한 묶음:클래스 간 상속을 통해, 보다 간소하고 효율적으로 코드를 작성하기 위한 개념&lt;예시 코드>: expends 통해 상위 클래

2020년 12월 23일
·
0개의 댓글
post-thumbnail

30. Whack A Mole

두더지 잡기 게임랜덤 구멍에서 랜덤 시간동안 출현 후 사라짐. 나타나는 동안 클릭하면 잡은 두더지 수 화면에 표시두더지 나타나는 구멍, 시간의 랜덤 숫자를 저장해당 구멍에 대한 class 명 추가하고, setTimeout로 일정 시간 후에 class명을 제거하도록하여

2020년 12월 20일
·
0개의 댓글
post-thumbnail

29. Countdown Timer

잠시 자리 비움 시간을 알리기 위한 카운트다운 화면 구현구체적으로, 미리 정해진 시간 단위 버튼 or 직접 입력 시간(분)에 대한 카운트다운 화면 구현화면 상에는 카운트다운 숫자와 최종 돌아올 시간(카운트다운 종료시간)을 텍스트로 보여줌지정한 카운트다운 시간을 더한 미

2020년 12월 20일
·
0개의 댓글
post-thumbnail

28. Video Speed Controller

비디오의 playbacRate를 manual 하게 조절하기 위한 UI와 function 연습video.playbackRatee.pageYelement.offsetTopHTML input tag 속성으로 min, max등을 정해서 더 쉽게 구현할 수 있지만, input

2020년 12월 19일
·
0개의 댓글
post-thumbnail

27. Click and Drag

가로 슬라이드 UI에서 마우스를 클릭 후 드래그를 통해 슬라이딩 효과 구현 내용mousedown 이벤트 발생 시 시작점, 좌측 scroll 최초 값을 저장mousemove 이벤트 발생 시, 저장된 시작점으로부터 드래그된 거리를 위에서 저장된 좌측 scoll 최초 값에

2020년 12월 19일
·
0개의 댓글
post-thumbnail

26. Stripe Follow Along Nav

nav 메뉴에 mouse pointer가 hovering 되면, 하위 dropdown 메뉴가 각각의 크기, 위치에 맞게 보여지도록 구현하는 내용https&#x3A;//stripe.com/ 참고event listener를 각 li element에 붙임mouse가 in,

2020년 12월 19일
·
0개의 댓글
post-thumbnail

25. Event Capture, Propagation, Bubbling and Once

Event 발생 시 bubbling과 capture 그리고 addEventListener 함수의 option 인자(capture와 once)에 대한 학습Event Bubbling: 특정 element에서 event 발생 시, 상위 element로 이벤트가 전파(prop

2020년 12월 19일
·
0개의 댓글
post-thumbnail

24. Sticky Nav

수동으로 CSS의 position: sticky와 같은 효과 구현하는 내용offsetTopscrollYcss position 속성을 fixed로 변경하면, 원래 차지하던 공간을 차지하지 않게되어 공간 변형이 일어나므로 유의

2020년 12월 18일
·
0개의 댓글
post-thumbnail

23. Speech Synthesis

Text to Speech 기능 구현voice 종류, rate, pitch도 함께 설정 (Html 상의 input value 연동)SpeechSynthesis API: text to speech 기능 구현 시 활용 APIhttps&#x3A;//developer.mozi

2020년 12월 18일
·
0개의 댓글
post-thumbnail

22. Follow Along Link Highlighter

마우스 포인터를 따라서 해당 텍스트의 길이와 위치에 맞게 하이라이트 효과가 되도록 구현 (stripe 웹페이지처럼, 메뉴 버튼에 hovering 하면, 이에 따라 선택 가능한 하위 메뉴 박스가 열리는 효과와 동일)'mouseover' event와 'mouseenver'

2020년 12월 18일
·
0개의 댓글
post-thumbnail

21. Geolocation

디바이스의 실시간 위치정보를 받아서, 현재 방향과 속도를 가져와 보여주는 내용navigator.geolocation.watchPosition(success, error, option) : 장치의 위치가 바뀔 때마다 자동으로 호출할 처리기 함수를 등록할 때 사용합

2020년 12월 18일
·
0개의 댓글