본문 바로가기

전체 글67

Babel 이란? 프로젝트 할 때 babel.config.js 파일을 보면서 이게 뭐지 싶어 검색해본 적이 있다. 그런데 이게 문법도 아니고 언어도 아니라 그런지 계속 그 의미를 잊게 되는 마성의 babel .... 그래서 오랜만에 자바스크립트 공부를 다시 하던 중에 babel 키워드를 발견해서 정리해보려고한다. babel 이란 무엇인가 ··· 자바스크립트의 변수 타입에는 var / let / const 가 있다. var 사용을 지양한다고는 하나, let / const 변수의 경우 IE9, IE10 에서 사용이 불가하다. 그러면 IE9, IE10 환경에서는 var 타입의 변수만 선언할 수 있는 걸까? 결론은 아니다! 왜냐하면 babel 이 존재하기 때문 ··· 구형 브라우저에서도 코드가 돌아갈 수 있게끔 도와주는 도구가 .. 2022. 5. 11.

git pull 할 때 오류나는 경우 git stash & git stash pop 사용하기 프로젝트에 작업을 하다가 프로젝트 업데이트를 위해 git pull 을 시도했는데 아래와 같은 오류를 접했다. 어떻게 해야할지 검색해보다가 찾은 방법인 git stash 명령에 대해 알아보고자 한다. git stash 란? 마무리하지 않은 작업을 스택에 잠시 저장해두는 명령어 커밋하지 않은 작업들을 git stash 를 이용하여 스택에 잠시 저장해두고 나중에 pop 하여 다시 가져올 수 있다. git pull 할 때 에러가 나면 1. git stash 를 사용하여 지금까지 작업했던 것들을 잠시 스택에 저장해두고 2. git pull 하여 프로젝트를 업데이트 시킨 다음 3. git stash pop 으로 작업물들을 다시 가져와서 내가 하던 작업을 이어서 할 수 있다. "이 포스팅은 쿠팡 파트너스 활동의 일환.. 2022. 5. 10.

addEventListener 이벤트 (input & change) 자바스크립트에서 input 태그에 텍스트가 입력이 되면 버튼을 활성화하도록 만드는 작업을 하다가 Input 이벤트와 change 이벤트의 차이점을 알게 되어서 기록해둔다. 작동 방식 인풋 박스 두 개에 모두 텍스트가 입력되면 "확인" 버튼의 비활성화가 활성화로 바뀌는 로직 1. 먼저 두 개의 input 요소를 각각 element.getElementById 로 가져온다. 2. 각 요소에 대해 addEventListener 를 걸어서 어떤 이벤트가 발생할 때마다 어떤 동작이 수행되도록 만든다. 이때 input 에 입력되는 값 변화를 실시간으로 알기 위해서 처음에는 onChange 즉 , "change" 이벤트를 넣었다. 그러나, change 이벤트를 사용하면 input 의 값 변화가 커서를 input 태그 .. 2022. 4. 25.

Dev Study #4 (feat. Design Pattern) Guarded Suspension 쓰레드를 기다리게 하여 인스턴스의 안전성을 지킨다. Request : 하나의 리퀘스트를 표현한 클래스 RequestQueue : 리퀘스트를 순서대로 비축해두는 클래스 ClientThread : 리퀘스트를 내주는 클래스 ServerThread : 리퀘스트를 받아 해석하는 클래스 Main : 동작 테스트용 클래스 Request 클래스 ClientThread 에서 ServerThread 에 건네진 인스턴스 name 필드를 가진다. // Request 클래스 public class Request { private final String name; public Request(String name) { this.name = name; } public String getName() .. 2022. 2. 21.

Dev Study #3 (feat. Design Pattern) [자바 언어로 배우는 디자인 패턴 입문] 도서를 읽고 공부한 내용입니다. Single Threaded Execution 패턴 하나의 쓰레드만이 처리를 실행할 수 있도록 제한을 둔 패턴 (하나의 쓰레드가 인스턴스의 상태를 변화시키고 있는 도중에는 다른 쓰레드가 인스턴스에 접근하지 못하도록 하는 패턴) 데드락 (deadlock) 두 개의 쓰레드가 두 개의 락을 차지하여 서로 상대의 쓰레드가 락을 해제하는 것을 기다리는 현상 데드락을 일으킨 쓰레드는 어떻게 해도 움직이지 않게 되므로 생존성을 잃는다. 데드락 조건 복수의 SharedResource (공유 자원) 역할을 하는 인스턴스가 있을 때 쓰레드가 어떤 SharedResource 역할의 락을 가진 채 다른 SharedResource 역할의 락을 가지러 갈 .. 2022. 2. 18.

Dev Study #2 (feat. JAVA) [자바 언어로 배우는 디자인 패턴 입문] 도서를 읽고 공부한 내용입니다. UML (Undefined Modeling Language) 시스템을 시상화하는 방법이나 설계를 문서화하기 위한 표현 방법 (ex. 클래스 다이어그램) 쓰레드 (Thread) 프로그램을 실행하고 있는 주체 싱글 쓰레드 프로그램 (Single Thread Program) 프로그램 처리가 하나의 흐름으로 이어지는 프로그램 어떤 시점에 실행되고 있는 처리는 하나이다. 메인 쓰레드 (Main Thread) 명령어 줄에서 지정한 클래스의 main 메소드를 실행 멀티 쓰레드 프로그램 (Multithreaded Program) 복수의 쓰레드가 동작하는 프로그램 (자바는 default 로 멀티 쓰레드 적용되어 있다.) Thread 클래스 run .. 2022. 2. 18.

Dev Study #1 BackEnd Web Server 와 WAS 의 차이점 Web Server => 소프트웨어 + 하드웨어 1) 정적인 컨텐츠 제공하며 WAS 를 거치지 않고 바로 자원을 제공한다. 2) 웹 브라우저 클라이언트로부터 http 요청(Request) 을 받아 WAS 에 보내고 WAS 가 처리한 결과를 클라이언트에게 전달 (Response) Apache Server, NginX 등 WAS (Web Application Server) => Web Server + Web Container (소프트웨어 엔진) 1) 동적인 컨텐츠 제공을 위해 만들어진 Application Server 2) JSP, Servlet 구동 환경을 제공한다. 3) Web Server 기능을 구조적으로 분리하여 처리하고자 하는 목적 ex) 분산.. 2022. 2. 16.

[MacOS] mac m1 에 node 설치하기 회사에서 드디어 mac 을 받았다!! (꺄아) 새로운 노트북을 받았으니 개발 환경 설정을 해야지.. jdk, tomcat, git, vscode, intellij 등등 homebrew install 하고 나서 git 다운 받고 진행했다. 위의 환경 설정까지는 나름 스무스했는데 node 가 문제였다. (14 버전 다운받아야 했음) @ 노드 버전 안나오는 문제 brew install node@14 node -v brew 명령으로 node 설치하려고 했는데 zsh: command not found: node 이런 문구가 뜨면서 node 가 제대로 설치되지 않음을 알렸다.. 그런데 brew list 로 다운받은 목록을 보면 node@14 가 있다. 다운이 되기는 했는데 뭔가 설정을 더해줘야 하나 싶어서 폭풍 검.. 2022. 2. 14.

[React] SPA 란? SPA(Single Page Application) : 한 개의 페이지로 이루어진 애플리케이션 전통적인 웹 방식(SSR : 서버 사이드 렌더링) 은 사용자가 다른 페이지로 이동할 때마다 새로운 html 을 받아오고 페이지를 로딩할 때마다 서버에서 리소스를 전달받아 해석한 뒤 화면에 보여주는 방식이었다. 즉, 사용자에게 보여주는 화면은 서버에서 준비했다. 이처럼 전통적인 웹 대부분은 서버 사이드 렌더링 방식이다. 그러나 요즘에는 웹에서 제공하는 정보가 정말 많기 때문에 새로운 화면을 보여줄 때마다 서버에서 모든 뷰를 준비한다면 성능상의 문제가 발생할 수 있다. (트래픽, 서버에 높은 부하 등) 그래서 리액트 같은 라이브러리 혹은 프레임워크를 사용하여 뷰 렌더링을 사용자의 브라우저가 담당하도록 하고 우선 애.. 2021. 11. 8.

이전 1 2 3 4 5 ··· 8 다음

티스토리툴바