본문 바로가기

분류 전체보기

 (92)
[Javascript] 자바스크립트로 비동기 데이터 전송 구현 방법 # 비동기 함수 요즘 웹 추세는 비동기로 데이터 통신을 하는 방식으로 가고 있다.비동기 데이터 통신을 모르면 웹을 할줄 모르는 사람이라고 할 정도로비동기 데이터 통신은 필수적이며 절대적이다.때문에 우리는 비동기 방식을 알아햐 한다. 비동기 방식과 동기방식의 차이는 조만간 포스팅 하도록 하겠다.먼저 코드를 보도록하겠다. const req = new XMLHttpRequest()req.open('GET', '/resource', true);req.onreadystatechange = () => { if (req.readyState === 4) { if (req.status === 200) success() else faile() }}req.send(null) > 우리는 XMLHttpRequest객체를 사용하..
[Javascript] 자바스크립트로 문자열 변경하는 방법 # 코드 - 특정 노드의 문자열을 변경하고 싶은 경우 document.querySelector('#foo').innerHTML = 'Hello umnyaum' > foo를 아이디로 가진 노드의 텍스트를 변경 # 마무리 위 포스트는 제가 직접 제작한 것 입니다.그렇기 때문에 틀린점이나 설명이 엉성한 점이 존재할 수 있습니다.만약 틀린점이나 설명이 엉성한 부분이 존재하면 댓글로 알려주세요.빠른 처리 하도록 하겠습니다. 티스토리 앱으로는 댓글 이용이 불가능 하므로 웹 브라우저로 봐 주세요(URL : http://junprogramer.tistory.com/) 읽어주셔서 감사합니다.
[Javascript] 자바스크립트에서 클래스를 추가하는 방법 # 코드 - 특정 노드에 클래스를 추가하는 방법 document.querySelector('#foo').classList.add('active'); > foo를 가진 노드에 active 클래스를 추가 document.querySelector('#foo').className += ' active'; > IE에서는 메소드 별로 지원 버전이 다르다. 때문에 위와 같은 방식으로 추가하거나 다른 방법을 사용해야 한다. # 마무리 위 포스트는 제가 직접 제작한 것 입니다.그렇기 때문에 틀린점이나 설명이 엉성한 점이 존재할 수 있습니다.만약 틀린점이나 설명이 엉성한 부분이 존재하면 댓글로 알려주세요.빠른 처리 하도록 하겠습니다. 티스토리 앱으로는 댓글 이용이 불가능 하므로 웹 브라우저로 봐 주세요(URL : http..
[Javascript] 자바스크립트 이벤트 구현하는 법 # 코드 - 이벤트 리스너 만들기 document.addEventListener('DOMContentLoaded', function() => { // start ...}) > HTML을 파싱한뒤 DOM 객체를 생성이 완료되면 ‘DOMContentLoaded’ 이벤트가 발생한다. 우리는 이 이벤트에 리스너를 추가하는 방식으로 똑같이 구현할 수 있다. - 클릭 이벤트 만들기 document.querySelector('a').addEventListener('click', evt => { // 이벤트 처리 ...}) or document.querySelector('a').click() > a태그를 가져와 클릭 이벤트를 작성한다. - 커스텀 이벤트 만들기 const evt = new CustomEvent('@cl..
[Javascript] 클래스 속성이나 아이디, 태그로 셀렉터 가져오기 # 코드 - 클래스 명 또는 아이디에 해당하는 값을 가지고 오고 싶을 경우 document.querySelector('#app' or '.app') - 클래스 명에 해당하는 노드를 찾고 싶을 경우 document.getElementsByClassName('container') document.querySelectorAll('.container') > 함수명에 “Elements”와 all 이라는 복수형에서 알 수 있듯이 여러 개 돔을 유사 배열 형태로 반환한다. - 태그명으로 노드를 가지고 오고 싶은 경우 document.getElementsByTagName('div') document.querySelector('div') document.querySelectorAll('div') - 해당되는 태그에 속성..
[React Native] 리액트 네이티브 처음 실행시 :app:transformNativeLibsWithMergeJniLibsForDebug 오류 발생할 경우 # 해결법 처음 리액트 네이티브를 실행할 경우 아래와 같은 오류가 발생하였다. * What went wrong:Failed to capture snapshot of output files for task ':app:transformNativeLibsWithMergeJniLibsForDebug' property 'streamOutputFolder' during up-to-date check.> Could not read path 'C:\workspace\react-native\greateApp\android\app\build\intermediates\transforms\mergeJniLibs\debug\0\lib'. 원인에 대해서 찾아보니 정확한 원인은 모르겠고android 와 gradlew에 에서 오류가..
[React Native] 리액트 네이티브에 버튼 추가시 DelegateUtil$accessibilityRole 오류가 발생할 경우 # 해결법 처음 리액트 네이티브 프로젝트를 만들고 실행을 하고 버튼을 추가후 실행하면아래와 같은 오류가 발생한다. java.lang.string cannot be cast to com.facebook.react.uimanager.accessibility DelegateUtil$accessibilityRole 나는 뭐 하나 만지지도 않았는데왜 이런 오류가 발생할까 찾아봤고 원인과 해결법을 발견하였다. 원인은 리액트 네이티브 최신 버전(0.57.3)인 node_module에 button 관련에서 오류를 발생 시키는 것이었다. 따라서 node_module을 삭제하고 다운 그레이드를 시키면 정상적으로 실행이 된다. 방법은 아래와 같다. 1) 프로젝트 root폴더에 들어간다. 2) rmdir node_module..
[NginX] Nginx /var/www/html 가 아닌 임의에 위치로 변경 방법 # 여는 글 Nginx를 사용할 경우 보통 기본 값으로우분투 기분 /var/www/html로 html을 넣어야만 실행이 가능해 집니다.하지만 이렇게 들어가지 않고 사용자가 정해놓은 임의에 폴더로 셋팅하고 싶어질 수 있습니다.그럴 경우 아래와 같은 명령어를 사용하면 쉽게 변경이 가능합니다. # 명령어 1. 처음 우분투를 실행 후 Nginx 설치 폴더로 들어갑니다.그 후 default라는 셋팅 파일을 vim 또는 vi 로 실행을 합니다. 저의 우분투 기준으로는 아래의 명령어를 사용하였습니다. $sudo vim /etc/nginx/sites-enabled/default 2. 그럼 셋팅과 관련된 구문들이 주르르륵 나와있습니다.저희는 다른건 다 필요 없고 root /var/www/html; 라고 되어 있는 곳을 ..

티스토리툴바