특정 버튼을 클릭하면 스크롤을 맨 위로 올리는 기능. jQuery와 Vanilla JS를 사용한 버전을 둘 다 써놓는다. 원하는 버전으로 쓰시길. jQuery 사용 //페이지 상단으로 이동하는 메소드입니다. const html_top = () => { // scrollTop은 상단이기 때문에 0, duration은 애니메이션 속도입니다 (ms) $('html, body').animate({ scrollTop: 0 }, { duration: 500 }); }; //버튼에 클릭 이벤트 바인딩해서 사용 $('#top_button').on('click', () => html_top()); Vanilla JS 사용 //페이지 상단으로 이동하는 메소드입니다. //임의의 버튼에 클릭 이벤트 리스너를 추가합니다. do..

jQuery를 이용한 Ajax 코드 예제이다. const ajax = (ajax_url, ajax_type, ajax_data, ajax_data_type) => { $.ajax({ // 요청을 보낼 URL url: ajax_url, // HTTP 요청 방식 (GET, POST) type: ajax_type, // HTTP 요청과 함께 서버로 보낼 데이터 data: ajax_data, // 서버에서 보내줄 데이터의 타입 ( xml, text, html, json 등) dataType: ajax_data_type, }) .done(function (data) { console.log('성공적으로 데이터 수신 : ' + data[0]); }) .fail((data) => { console.log('실패');..

https://min9nim.github.io/2018/12/super-props/ [React] super(props) 를 써야하는 이유 이 글은 Dan Abramov의 Why Do We Write super(props)? 글을 충분한 의역으로 번역한 것입니다. 번역이 일부 자연스럽지 않은 부분이 있을 수도 있습니다. 정확한 내용은 원문을 참고하기 바랍니다 최근 Hooks min9nim.github.io js언어에선 상속 클래스의 특성상 super()이 생성자에 강제된다. super()만 선언하더라도 작동은 보장된다. (props가 생성자 이후에 자동으로 세팅됨) 다만 생성자 호출 이후에 props가 세팅되기 때문에, 생성자 내부에서 사용되는 this.props는 undefined가 되어버린다. 이 때..

Ubuntu 20.04 LTS 홈 서버 구축기 (2) 저번 편에서는 ubuntu20.04 LTS 버전을 내 서버에 설치하는 부분까지 진행했다. 사실 이 시리즈는 친절하게 설치 방법을 알려준다는 목적보다는, 내 스스로의 기록과 회고 측면에 가깝기 때문에 중�� nookpi.tistory.com 거지같은 방식으로 크롤링 데이터를 저장하고 가져오던 AWS를 벗어나, (AWS 는 죄가 없다.. 내가 못났을 뿐...) 홈 서버 구축과 동시에 DRF api 로 이전되었다. 당분간 aws는 그대로 유지되지만 이미 폰에 있는 스크립트에서도 뉴스룸 서버는 홈 서버로 이전한 상황이다. 기존에 aws에 구축했던 여러 서비스들 (php로 만든 맛집 정보 크롤링 웹사이트 , STT 웹 서비스)도 차차 홈서버로 이전할 계획이다.

저번 편에서는 ubuntu20.04 LTS 버전을 내 서버에 설치하는 부분까지 진행했다. 사실 이 시리즈는 친절하게 설치 방법을 알려준다는 목적보다는, 내 스스로의 기록과 회고 측면에 가깝기 때문에 중간중간 많은 부분이 생략될 수 있다. 이점 양해 부탁드린다. 처음으로 접해본 리눅스는 ubuntu18.04 였는데, 당시에 APM을 수동 설치(컴파일 설치) 하면서 개고생 했던 기억이 생생하다. 자동 설치의 존재를 몰랐던 건 아니지만, 아무튼 리눅스를 처음 접하던 당시에 APM 설치는 고난과 역경의 연속으로 기억에 남는다. 설치 단계의 여러 옵션들을 익히느라 어려웠던 점도 있지만, 설치 경로가 기본이 아니다 보니 나중에 호환성과 conf 수정 등에서 정말 많은 난관을 겪었다. 하지만 지금은 그럴 필요가 굳이..

개인 확인 및 공부용입니다. // 정규식 패턴 (Regex Pattern) // 단순 패턴 사용하기 // /hi/ --> 문자열에서 정확히 'hi'부분이 나타나야 대응됩니다. // 특수 문자 사용하기 // \ --> 특수 문자가 아닌 문자 앞에서 사용되면 해당 문자는 특별한 명령어로 간주됩니다. // ex) \b 는 단어 경계에 대응됩니다. // ^ --> 입력의 시작 부분에 대응합니다. // ex) /^A/ 는 "an A" 의 'A'와는 대응되지 않습니다, 그러나 "An E" 의 'A'와는 대응됩니다. // $ --> 입력의 끝 부분과 대응됩니다. // ex) /t$/ 는 "eater" 의 't'에는 대응되지 않습니다, 그러나 "eat" 과는 대응됩니다. // * --> 앞의 표현식이 0회 이상 연속으..