여행하는 코딩끄적끄적

블로그 만들기(2)에서 만들었던 내용에서 웹에디터를 추가해보겠다. 웹에디터란 흔히 티스토리나 네이버 블로그에서 글을 작성할때 색깔이나 편집을 편하게 하도록 만들어진 UI이다. 직접 만드는 것은 javascript 나 css에 굉장한 노력이 들어간다. 하지만 이를 간단히 해결하는 방법은 summernote라는 오픈 소스를 사용하는 것이다. 오픈 소스를 통해 아래와 같은 웹에디터를 가질 수 있다. 아래는 summernote 웹페이지 주소이다. 해당 링크로 들어가면 어떻게 사용하는지 자세히 설명 되어 있다. summernote.org/ Summernote - Super Simple WYSIWYG editor Super Simple WYSIWYG Editor on Bootstrap Summernote is a ..

블로그만들기(1)에서 게시판 글쓰는 환경을 구축하였다. 이제 글쓰면 바로 글 내용을 확인할 수있는 게시판 읽기 기능을 만들 것이다. 동작원리는 아래와 같다. 1. 게시물 쓰기가 완료 되면 해당 게시물을 읽는 페이지로 HTTP GET 요청을 보낸다. 2. 요청과 함께 db 인덱스 번호인 _id 값을 GET 신호와 같이 보낸다. 3. _id 값으로 db에 접근해서 읽고 html로 출력해준다. 코드 - bulletin_wr.html >> {{db_data.title}} {{db_data.pubdate}} {{db_data.contents}} 주석>> bulletin_rd 주소로 HTTP GET 요청을 받으면 flask를 통해 db_data를 전달 받고 받은 값을 html로 보여준다. 코드 - board_01...

참조 링크 (link)>> flask.palletsprojects.com/en/1.1.x/quickstart/ Python flask에서 HTML과 변수 주고 받기 파이썬에서 HTML을 만들고 변경하는 것은 쉬운 작업이 아니다. application 보안을 위해 동적으로 바뀌는 값을 escape 처리 해서 작성해야하기 때문이다. Flask에서 jinja2 엔진을 공급한다. 간단하게 render_template 함수로 html 에 접근하면서 원하는 변수도 같이 보내 줄 수 있다. html 문서에서는 받은 변수 값을 {% %} {{ }} 괄호 안에서 사용 전자는 문법용이고 후자는 변수를 바로 사용할때 사용한다. 이렇게 사용이 가능하게 해주는 것을 jinja2 엔진이 가능하게 해주는 것이다. 아래 예제 코드를..

참조 링크 (link)>> flask.palletsprojects.com/en/1.1.x/quickstart/ 1. Route 기능 라우트는 외부 웹브라우져에서 웹서버로 접근 시 해당 주소로 입력을 하게 되면 특정 함수가 실행되게 도와주는 기능을 한다. 아래 예제 코드는 /hello 라는 주소에 접근하면 return 으로 'Hello, World' 을 보낸다. 코드 >> from flask import * ######################################################### # Flask 선언 app = Flask(__name__, template_folder="templates") @app.route('/hello') def hello(): return 'Hello, ..

개인 블로그를 처음부터 만들면서 공부할 예정이다. 우선 웹서버를 동작 시켜줄 프로그램은 Flask를 사용할 생각이다. 그리고 블로그 컨텐츠들은 mongo db에 저장하고 robo 로 결과를 확인할 생각이다. flask 와 mongodb에 대한 부분은 내 블로그 카테고리 또는 검색을 통해 알아보자. 아래 코드는 파이썬에서 flask 모듈을 가져와서 선언해주고 mongodb와 연결한 코드이다. 제대로 연결이 되었는지 확인을 위해 임의로 작성한 데이터를 mongodb에 업로드 해보고 결과를 확인해보겠다. 코드>> from flask import * from flask_pymongo import PyMongo import time #############################################..

앞서 장에서는 처음에 인스타 자동 로그인을 실행하였다. 그리고 해시태그를 이용해서 자동 검색을 하였다. 그리고 원하는 페이지만큼 자동으로 좋아요를 클릭하였다. (앞에 내용을 확인하고 싶다면 블로그에 인스타그램 카테고리에서 확인할 수 있다.) 이번장에는 좋아요를 클릭하고 동시에 해당 페이지에 "hello BTS" 라는 댓글을 남길 것이다. 이번 코드의 진행 순서는 아래와 같다. 1. 자동 로그인 2. #BTS 로 검색하기 3. 페이지 "좋아요" 클릭하기 4. 댓글로 "hello BTS" 남기기 5. 다음페이지로 넘기기 6. 3~5번을 8번 반복하기. 우선 댓글에 xpath 위치를 instagram에서 확인해보자. xpath에 대한 내용은 아래 링크에서 확인할 수 있다. scribblinganything.t..

최근 웹 어플리케이션은 AJAX를 많이 사용한다. 즉, 페이지 전체를 로딩하는 것이 아닌 일부만 서버와 AJAX 통신을 하는 것이다. 그래서 브라우져에서 페이지를 로딩시 페이지에 element 들이 다른 시간대에 도착할 수 있다. 만일 페이지는 불렀고 우너하는 element가 아직 로딩 안된 상태에서 해당 위치를 selenium으로 찾으려고 하면 실패한다. ElementNotVisibleException 를 리턴해주게 된다. 셀레늄에는 두가지 방법으로 원하는 element가 로딩되는 시간을 기다려 준다. - Explicit Waits - Implicit Waits 1. Explicit Waits Explicit Waits 는 파이썬 개발자가 정한 조건이 될때까지 기다렸다가 되면 다음으로 진행한다. 조건문..

웹 페이지 element를 찾는 방법은 여러가지가 있다. 사용자는 셀레늄을 사용해서 가장 적절한 방법으로 찾으면 된다. Selenium 에서는 아래 방법들을 통해 element를 찾을 수 있게 도와 준다. - find_element_by_id - find_element_by_name - find_element_by_xpath - find_element_by_link_text - find_element_by_partial_link_text - find_element_by_tag_name - find_element_by_class_name - find_element_by_css_selector 여러개의 element를 리스트형의 리턴으로 받으려면 아래 방법을 사용하면 된다. - find_element_by_..

JSON 의 의미와 사용 목적 JavaScript Object Notation (JSON) 는 텍스트 형식으로 구조화된 형태로 자바스크립트 구문을 사용한다. JSON은 데이터를 웹 application에 전송할때 주로 사용된다. 가령 데이터를 서버에서 클라이언트의 웹브라우저로 보내거나 반대로 웹에서 서버로 보낼 때 사용된다. JSON 이 비록 자바스크립트의 형태를 따르기는 하지만 자바스크립에서 독립적으로 사용될 수 있고 많은 프로그램 환경에서도 JSON 기능을 제공한다. 현재 내가 개발하고 있는 환경은 파이썬 Flask를 이용해서 웹서버를 만들고 웹서버에서 주기적으로 웹브라우저에 데이터를 보내주는 예제이다. 만일 JSON을 사용하지 않고 데이터를 보내려고 한다면 python에서 별도의 encoding 과..

자바스크립트의 객체 지향을 공부했다. 파이썬의 Class 와 유사했다. 파이썬의 클래스에서 init에서 변수를 선언하고 그 뒤에 함수들을 선언해서 사용하는 것과 유사하게 javascript 에서 사용할 수 있다. 아래 예를 통해 이해해 보자. 코드>> 결과>> 주석>> a_var 라는 객체 안에 변수들을 키값하나에 다시 객체로 넣었다. 그리고 함수를 'function'이라는 키값 안에 넣었다. for 문 안에 this가 있는데 이것은 python에서 self를 말하는 것처럼 여기서는 a_var 자신을 가리키는 것이다. 그래서 a_var에서 변수 키값인 "variables"를 사용해서 값을 가져와서 함수에 적용한 것이다.