seoyoung.dev

졸업 프로젝트 시연용 웹앱을 만들기 위해 Django Framework 를 사용하였고, pythonanywhere 로 배포하였습니다. 간단하지만, 조금은 삽질을 했던 터라 기록을 남기기로.. git 을 사용해서 작업하던 레포지토리를 사용하겠습니다. pythonanywhere 가입-> Beginner 로 가입 완료하였다면, $Bash 콘솔로 접속 1. repository clone 해오기 $ git clone https://github.com// # username은 github-usename이기 때문에, github repository 에서 copy한 링크 그대로 paste 해줍니다. 2. 기존에 가상환경이 있던 경로로 이동 -> 새로운 가상환경 생성 & 실행 $ virtualenv --python=py..

1. json 데이터 내에서, value 가 숫자인 key 값들 출력 더보기 var data = { "debug": "on", "window": { "title": "Sample Konfabulator Widget", "name": "main_window", "width": 500, "height": 500 }, "image": { "src": "Images/Sun.png", "name": "sun1", "hOffset": 250, "vOffset": 250, "alignment": "center" }, "text": { "data": "Click Here", "size": 36, "style": "bold", "name": "text1", "hOffset": 250, "vOffs..

자바스크립트 시리즈는 '생활코딩-클라이언트 과목의 '웹브라우저 자바스크립트' 강의'를 참고로 공부하고 기록하기 위한 용도입니다. * Event - Event target : 지정한 이벤트가 발생하는 대상을 말하며, 위 코드의 경우에는 버튼 태그의 객체입니다. - Event type : 이벤트의 종류를 의미하며, 위 경우 'click'이 이벤트 타입입니다. + 이벤트 타입의 종류 - Event Handler : 이벤트가 발생했을 때 수행될 코드를 말하며, 위에서는 'alert(window.open)'을 가리킵니다. 대부분 function 이벤트 핸들러 를 차지합니다. -> 이벤트를 동작시키기 위해서는, 이벤트의 대상에 이벤트 핸들러를 등록해줘야 하는데, 등록하는 방법에는 Inline방식 , Property..

자바스크립트 시리즈는 '생활코딩-클라이언트 과목의 '웹브라우저 자바스크립트' 강의'를 참고로 공부하고 기록하기 위한 용도입니다. * innerHTML : 특정 element의 내부 HTML 내용을 가져오거나, 특정 요소의 HTML 내용을 변경합니다. HTML CSS -> 의 id를 통해 의 안의 html 코드를 변경해줘서, set 버튼 클릭시, html 코드가 변경됩니다. Naver -> change Link 버튼을 누르면, 나타나는 링크가 바뀌게 됩니다. * outerHTML HTML CSS function set(){ ..

자바스크립트 시리즈는 '생활코딩-클라이언트 과목의 '웹브라우저 자바스크립트' 강의'를 참고로 공부하고 기록하기 위한 용도입니다. * Node 객체 : HTML 코드의 모든 구성 요소들은 Node 객체의 상속을 받고, Node 객체는 firstChild,parentNode,nextSibling,previousSibling 과 같은 API 를 갖고 있다. 이러한 property 를 통해, 각 노드를 기준으로 형제, 부모, 자식 같은 관계를 알아낼 수 있다. Node.childNodes - 자식노드들을 유사배열에 담아서 리턴 Node.firstChild - 첫번째 자식 노드 ( 두 태그 사이에 줄바꿈 이나 여백도 child 로 포함된다. ) Node.lastChild - 마지막 자식 노드 Node.nextSi..

자바스크립트 시리즈는 '생활코딩-클라이언트 과목의 '웹브라우저 자바스크립트' 강의'를 참고로 공부하고 기록하기 위한 용도입니다. ( DOM 은 HTML 만을 제어하기 위한 모델이 아니므로, Element 와 HTMLElement 라는 객체가 따로 구성된다. ) * 식별자 API html css JAVASCRIPT - Element.tagName console.log(document.getElementById('active').tagName); //tagName 은 변경 불가, Readonly - Element.id var Active = document.getElementById('active'); console.log(Active.id); //active console창 출력..

자바스크립트 시리즈는 '생활코딩-클라이언트 과목의 '웹브라우저 자바스크립트' 강의'를 참고로 공부하고 기록하기 위한 용도입니다. -> DOM (document object model) 은 웹페이지를 자바스크립트로 제어하기 위한 객체모델을 의미한다. window 객체의 document 프로퍼티를 통해 사용할 수 있으며, 앞서 익힌 window 객체가 '창'을 의미한다면, document 객체는 윈도우에 로드된 '문서'를 의미한다. -> 문서를 자바스크립트로 제어하려면, 제어의 대상에 해당되는 객체를 제일 먼저 찾아야 한다. * getElementsByTagName() html css JAVASCRIPT html css JAVASCRIPT * getElementsByClassName() 과 getElemen..

자바스크립트 시리즈는 '생활코딩-클라이언트 과목의 '웹브라우저 자바스크립트' 강의'를 참고로 공부하고 기록하기 위한 용도입니다. * Location 객체 - 현재 브라우저의 URL 에 대한 정보를 지니고 있으며, window 객체의 property 로, window.location 형태로 접근 가능하다. - Location 객체를 이용해서, 윈도우의 문서 URL 을 변경할 수 있고, 문서의 위치와 관련한 정보들을 얻을 수 있다. console.log(window.location.href); //현재 페이지의 url return console.log(window.location.hostname); //웹 호스트의 domain name을 return console.log(window.location.path..