본문 바로가기
[py] 카카오 이미지 검색 오픈 api 카카오 오픈 이미지 검색 api 를 이용하여 원하는 이미지를 수집합니다. 카카오 이미지 검색 오픈 api 개발 문서 사이트 https://developers.kakao.com/docs/latest/ko/daum-search/dev-guide Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다. developers.kakao.com 오픈 API 개발 문서 오픈 API로 원하는 이미지 저장하기 #카카오 오픈 API 이미지 저장 import requests import json #img_url로 file_name 파일로 저장하기 def save_imgFn(img_url, file_name): ..
[py] 파일 읽기 쓰기 파이썬을 이용해 text 파일에 텍스트를 쓰고, 그것을 읽는 방법을 알아보겠습니다. 파일 쓰기 #파일 쓰기 data = 'hello' with open('text.txt', 'w') as fp: fp.write(data) 결과 작업 폴더 text.txt 파일이 생성되었고, 파일을 열면 hello라고 입력되었습니다. 파일읽기 #파일 읽기 with open('text.txt', 'r') as fp: print('파일 읽기') print(fp.read()) 결과
[react] 라이프 사이클, useEffect 정리 라이프사이클 componentDidMount() {} 컴포넌트가 처음 렌더링 된 직 후 동작 setState를 렌더 안에서 사용할 수 없음 (무한 렌더링 발생하기 때문에) componentDidUpdate() {} setState 또는 props로 리렌더링 되었을때 동작 componentWillUnmount() {} 컴포넌트가 제거되기 직전 비동기 요청 수동으로 clear 처리 해야 함 안하면 메모리 누수 문제 발생 showcomponentupdate() {} useEffect useEffect(() => { componentDidmount 역할 코드 return () => { componentWillUnmount 역할 코드 } }, [바뀌는 state 값, componentDidUpdate 기능]) 라..
[js] 숫자 여부 확인 isNaN() is not a number의 약자 true 일 경우 숫자가 아니고, false일 경우 숫자 isNaN(value) isNaN() 예제 isNaN(50) //number //false isNaN('goddino') //string //true
[react] 스크립트 추가하기 리액트 컴포넌트 내부에 스크립트 추가하는 방법 useEffect(() => { const script = document.createElement("script") script.src = "..." script.async = true document.body.appendChild(script) })
[react] 자동 로그인 자동 로그인 모바일에서 자동 생성된 token을 url로부터 가져와 내부 저장소에 저장하고, 백엔드로 전달 const params = new URL(document.location).searchParams //모바일에서 자동 생성된 firebaseToken 가져오기 const firebaseToken = params.get("firebaseToken") const onAutoLogin = useCallback(() => { //자동 로그인 if (firebaseToken !== null && firebaseToken !== "") {//token 있을때 window.sessionStorage.setItem("token", firebaseToken) //토큰 저장 api.post(`로그인 api`, { f..
[jquery] 아코디언 기능 구현 쇼핑몰에서 상품 목록 상세내역에 많이 사용되는 아코디언을 제이쿼리로 구현하였습니다. 구현 화면 구현 영상 제이쿼리 스크립트 및 css 아코디언 jQuery 코드 html 구조 title ... subtitle1 .../ subtitle2 .../ subtitle3 .../
[react] browser-image-compression 이미지 리사이징 적용 커뮤니티를 구현하다가 이미지를 별도의 처리 없이 서버로 보낸 후, 가져오다 보니 로딩 시간이 많이 걸려 프론트에서 이미지를 압축한 뒤 서버로 보내어 로딩속도를 개선했습니다. 구현방법 react, redux-toolkit 사용 자바스크립트 imageㄹ 리사이징 압축 라이브러리, browser-image-compression를 사용 총 3개의 이미지까지 보낼 수 있어서 for문을 이용 문제점 Promise로 만들어진 browser-image-compression 라이브러리를 그대로 이용하여 actionImgCompress 함수의 리턴값을 변수에 저장하니 결과값이 array가 아닌 promise {}[[prototype]]: promise[[promise state]]: "fulfilled"[[promiser..
[py] 파일 입출력 자동화 구현 내용 텍스트 파일에 있는 텍스트를 그대로 불러와서 프린트 텍스트 파일에 입력하기 파일 입출력 자동화 코드 encoding='UTF8' 없을 경우, UnicodeDecodeError: 'cp949' codec can't decode byte 0xeb in position 0: illegal multibyte sequence 라는 오류가 발생 불러오기 open('불러올 파일경로', 'r', encoding='UTF8') 쓰기 open('저장할 파일 경로', 'w', encoding='utf-8') 구현 코드 //읽기 f = open('네이버_연관검색어.txt', 'r', encoding='UTF8') msg = f.read() print(msg) //쓰기 f = open('네이버_연관검색어.txt', ..
[py] 네이버 블로그 좋아요 자동화 (ft. 셀레니움 actionchains) 구현 내용 1. 셀레니움 라이브러리의 웹드라이버 크롬 실행 2. 네이버 자동 로그인 3. 네이버 블로그로 이동 (3~5번 무한 반복) 4. 최근 포스팅 클릭 5. 좋아요 클릭 actionchains 매크로 프로그램을 만들때 사용하는 pyautogui를 웹에서 작동할 수 있도록 물리적 기능을 지원하는 라이브러리 특정사이트가 자동화나 크롤링을 사전에 막아서 element의 click이 작동하지 않는다면 actionchains를 이용하여 물리적으로 실행 elements로 마우스 이동: ActionChains(driver).move_to_element(요소 변수) 주의 사항 실제 작동시에는 스팸 처리를 당하지 않기 위해 random 함수를 사용합니다. 구현 코드 from selenium import webdri..
[py] 사이트 로그인 방법 (ft. 보안 처리 유무) 구현 과정 셀레니움 라이브러리의 웹드라이버 크롬 실행 사이트 자동 로그인 실행 로그인 자동화(단순 로그인, 보안 처리 없음) id = driver.find_element(By.XPATH, 'id xpath') #xpath, css selector, id, class명 다양하게 사용 가능 id.click() id.send_keys('아이디') time.sleep(2) pw = driver.find_element(By.XPATH, 'pw xpath') pw.click() pw.send_keys('비번') time.sleep(2) pw.submit() time.sleep(10) 로그인 자동화(보안 처리 있음) send_keys(Keys.COMMAND, 'v') 를 위해 webdriver.common.keys ..
[py] 인스타그램 좋아요 자동화 구현 화면 구현 내용 인스타그램 로그인 후 '좋아요반사' 태그 페이지 호출 페이지 내 모든 게시물 클릭 후 세부 페이지에서 좋아요 후 닫기 아쉬운 점 현재 페이지에 9개의 피드가 올라와 9가지 좋아요 자동화가 가능하지만, 페이지네이션 부분이 안보여, 쿼리를 찾을 수 가 없어 다른 페이지로 이동처리를 하지 않음 클래스명이 자주 바뀌는 것 같음 구현 코드 from selenium import webdriver from selenium.webdriver.chrome.service import Service from selenium.webdriver.chrome.options import Options from webdriver_manager.chrome import ChromeDriverManager #크롬 ..
[api] api 사이트 모음 더미 api를 제공하는 사이트들 입니다. 여러가지 API 모음 https://github.com/public-apis/public-apis GitHub - public-apis/public-apis: A collective list of free APIs A collective list of free APIs. Contribute to public-apis/public-apis development by creating an account on GitHub. github.com https://github.com/dl0312/open-apis-korea GitHub - dl0312/open-apis-korea: 🇰🇷 한국어 사용자를 위한 서비스에 사용하기 위한 오픈 API 모음 🇰🇷 한국어 사용자를 위한 ..
[git] git commit 없이 강제 git pull git 최신버전으로 커밋 없이 강제 git pull로 덮어쓰는 방법입니다. 홈페이지를 여러 개발자가 작업하다보면 git pull시 merge 오류와 git commit 하라는 메시지가 뜨는데요. 로컬 상태에 상관없이 commit 없이 git pull로 덮어쓰는 방법입니다. 강제 git pull 하기 --all 옵션을 통해 모든 커밋 정보를 가져옴 $git fetch --all git reset을 통해 head의 포인트를 최신 커밋으로 옮김 --hard 옵션은 강제로 head를 옮기는 것 $git reset --hard origin/master git pull 로 최신 커밋 덮어쓰기 $git pull
[py] 네이버 블로그 이웃 추가 자동화 1, 2, 3단계에 걸친 네이버 블로그 이웃추가 자동화입니다. 구현내용 flow 네이버 로그인 자동화 모바일 페이지 검색후 뷰탭으로 이동 검색 옵션은 블로그, 최신순 쿼리 주소 첫번째 포스팅 블로그 아이디 클릭 이웃 추가 버튼 클릭(가능할때만 - 이미 이웃인 상태, 이웃 받지 않을 경우 불가능) 서로 이웃 버튼 클릭(서로 이웃 신청 받지 않을 경우 불가능) 이웃 신청 멘트 기존의 것 삭제 후 새로운 멘트 작성 확인 클릭 1단계 1명 자동으로 이웃 추가 2단계 처음 로딩된 페이지 내 모든 이웃 자동으로 이웃 추가 3단계 n명 만큼 자동으로 이웃 추가 1단계 try, except 구문으로 예외 처리하는 이유: (서로)이웃추가 금지로 이웃추가가 안되는 경우를 처리해야 함 이웃추가 버튼, 서로이웃추가 버튼 클릭..
[py] 파이썬 gui (ft. pyqt5 설치, 기본 세팅, Qt designer 설치) PyQt 파이썬 gui 라이브러리 Qt designer 설치 Qt designer는 PyQt 디자인 편집기 구글에서 qt desinger download 검색하여 다운로드 Mac 오류 해결 방법 개발자를 확인할 수 없기 때문에 열 수 없습니다. 알림창 해결 방법 - 시스템 환경설정 -> 보안 및 개인 정보 보호 - 다음에서 다운로드한 앱 허용 -> 확인 Qt designer 설치 후 화면이 이상할때 Preferences -> Appearance -> User Interface Mode -> Docked Window pyqt5 설치 pip install pyqt5 #window pip3 install pyqt5 #mac pyqt5 기본 세팅 from PyQt5.QtWidgets import * from P..
[py] 네이버 연관검색어 결과 크롤링 ajax를 이용한 네이버 자동검색 결과 크롤링 구현 내용 네이버 검색어 입력시 연관 검색어 리스트 크롤링 ajax를 호출하는 request url을 이용해 페이지 호출 검색어 + ㄱ ~ ㅎ까지 추출하여 메모장(.txt)에 저장 구현 코드 json.loads(data) 를 통해 딕셔너리 형태로 변환 import requests import json import pyautogui keyword = pyautogui.prompt('검색어를 입력하세요.') letters = ['ㄱ','ㄴ','ㄷ','ㄹ','ㅁ','ㅂ','ㅅ','ㅇ','ㅈ','ㅊ','ㅋ','ㅌ','ㅍ','ㅎ'] f = open(f'{keyword}.txt', 'w', encoding='utf-8') # 파일 열기 모드 w : 새로 만들기, a :..
[react] 검색어 자동완성 구현하기 검색어 자동완성 구현하기 구현화면 구현내용 react hooks를 이용한 검색어 자동완성 기능 useSelect, useDispatch 사용 searchForFood 함수는 음식 찾기 api onResetSearchedFood 찾은 음식 없애기 api searchedFoodLists 필터링된 음식 리스트 - 최종 결과 데이터 검색어 자동완성 코드 그동안 검색어 자동완성 구현 방법을 여러가지 사용해왔었는데 주로 value값의 길이가 2이상부터 api 콜을 불러오는 식으로 하였으나, 이번에는 value값이 있을때마다 0.2초간 api 를 불러 데이터를 찾아주고, value 값이 없을때 데이터 리스트를 없애주는 방법으로 구현하였습니다. useEffect(() => { //검색어 자동 완성 let params ..
[css] 텍스트 줄바꿈 해결 텍스트가 영역을 넘칠때 줄바꿈 처리하는 css 줄바꿈 처리 css 태그 안에 텍스트 입력을 하고 바로 출력시 줄바꿈이 적용안되었을 경우, 줄바꿈을 그대로 적용해주는 css white-space: pre-line; before after
[py] 크롤링 데이터 엑셀에 저장 예제는 스타트 코딩, 파이썬 크롤링 강의를 들으면서 공부한 내용입니다. 구현 내용 openpyxl 라이브러리 사용 네이버 주식정보의 3가지 종목 현재가 크롤링 현재가만 비워진 엑셀파일 미리 저장 크롤링 데이터 엑셀에 저장 적용 코드 import requests from bs4 import BeautifulSoup import openpyxl fpath = r'C:\project\python\practice\data.xlsx' #현재가만 비워진 미리 저장된 엑셀시트 wb = openpyxl.load_workbook(fpath) #엑셀 불러오기 ws = wb.active #현재 활성화된 기본 시트 # 종목코드리스트 codes = ['005930','000660', '035720'] row = 2 #행값을 돌..
[react] throttle 적용하기 react에 throttle를 적용한 코드입니다. throttle 동일한 이벤트가 반복적으로 시행되는 경우 이벤트의 실제 반복 주기와 상관없이 임의로 설정한 일정 시간 간격으로 콜백 함수의 실행을 보장합니다. 즉 일정시간동안 1개의 콜백함수를 실행하게 하여 짧은시간 동안 불필요하게 동일한 함수 실행을 막습니다. 화면 구현 throttle 코드 제로초님의 블로그를 참조한 코드 rottle: 동일 이벤트가 반복적으로 시행되는 경우 이벤트의 실제 반복 주기와 상관없이 임의로 설정한 일정 시간 간격(밀리세컨드)으로 콜백 함수의 실행을 보장합니다. function throttle(fetchData, delay = 600) { //throttle 사용코드 let timer; return function () { i..
[py] request 이용하여 웹 크롤링 예제 request를 라이브러리를 이용해 네이버 크롤링 예제입니다. 크롤링 주제: 네이버에 코딩하는 갓디노를 검색하여 나오는 데이터 크롤링 코드 import requests from bs4 import BeautifulSoup #print(response.status_code) #통신 응답 결과 200: 정상 404: 페이지 찾을 수 없음 pageNum = 1 for i in range (1, int(4* 10), 15): #총 4개의 페이지가 있고, i값이 1, 16, 31 순으로 진행 print(f' {pageNum} 페이지 -----------------------------------') response = requests.get(f'https://search.naver.com/search.naver?..
[py] 메일 자동화 발송 (ft. 셀레니움) 파이썬, 셀레니움을 이용한 네이버 메일 자동화 보내기 입니다. 예제는 스타트 코딩, 파이썬 크롤링 강의를 들으면서 공부한 내용입니다. 네이버 메일 자동화 보내기 코드 본문인 body 부분이 iframe 태그에 쌓여있기 때문에 iframe 태그 내부에 들어가서 본문을 작성 후 다시 iframe 나가는 별도의 코드가 필요 #셀레니움 기본설정 from selenium import webdriver from selenium.webdriver.chrome.service import Service from selenium.webdriver.chrome.options import Options from webdriver_manager.chrome import ChromeDriverManager #크롬 드라이버 자동 ..
티스토리 블로그 html 배너 출력 플러그인 사용법 티스토리의 플러그인을 사용하여 html 배너 생성하는 방법입니다. 사이드바에 배너 생성하기 티스토리 블로그 메인화면의 사이드바에 html 배너를 생성하겠습니다. html 배너 플러그인 설치 티스토리 관리 > 플러그인 화면에서 배너 출력을 설치합니다. 배너 파일 업로드 티스토리 관리 > 스킨편집 > html 편집 > 파일업로드로 가서 배너 이미지를 업로드 시킵니다. 업로드 이미지 오른쪽 마우스 클릭 > 링크 주소 복사를 해놓습니다. html 배너 코드 적용 html 배너 모듈을 설치하였으므로 티스토리 관리의 사이드바 선택시 사이드바3에 html 배너출력 플러그인이 나타납니다. 편집 선택 배너 이름과 html 소스를 적용합니다. 의 코드 입력 배너 위치한 사이드바에 옮기기 사이드 바 > 기본 모듈 > 편집한..
[py] 이미지 사이즈 줄이기 파이썬을 이용하여 이미지 사이즈를 일괄 수정하는 방법입니다. 예제는 스타트 코딩, 파이썬 크롤링 강의를 들으면서 공부한 내용입니다. 이미지 조정 라이브러리 pillow pip install pillow #이미지 처리 라이브러리 이미지 사이즈 조정 코드 이미지 열때, 저장할때 경로가 필요합니다. import os from PIL import Image # 정리할 확장자 리스트 extention_list = ['.jpg', '.png', '.gif'] #해당 이미지 폴더 target = 'C:/project/python/랜덤이미지' #만들 폴더 destination = os.path.join(target, 'small') #폴더가 없다면 폴더 생성 if not os.path.exists(destination..
[py] 파이썬 랜덤 이미지 생성 파이썬을 이용한 랜덤 이미지 100개를 자동 생성입니다. 구현 화면 랜덤이미지 만들기 라이브러리 numpy pip insall pandas #pandas 설치하면 numpy가 같이 설치 됨 pillow pip install pillow #이미지 처리 라이브러리 랜덤이미지 생성 코드 import numpy from PIL import Image import os #만들 폴더 경로 target = 'C:/project/python/랜덤이미지' #폴더 만들기 if not os.path.exists(target): os.mkdir(target) for i in range(0, 101): filename = f'img{i}.jpg' #3차원 rgb 랜덤 배열 생성 rgb_array = numpy.random.ra..
[react] react-infinite-scroll-component 사용법 (ft. 무한 스크롤) react-infinite-scroll-component 라이브러리 사용법입니다. 화면구현 react-infinite-scroll-component 기본 예제 import React from 'react'; import InfiniteScroll from 'react-infinite-scroll-component'; const Component = () => { const [items, setItems] = useState(Array.from({ length: 40 })) const fetchData = () => { setTimeout(() => { setItems(items.concat(Array.from({ length: 50 }))) }, 1500); }; return ( {items.map((i..
[py] 파일 및 폴더 정리하기 예제는 스타트 코딩, 파이썬 크롤링 강의를 들으면서 공부한 내용입니다. os 라이브러리 os라는 라이브러리를 사용하고, 내부 저장된 라이브러리로 별도 설치 필요 없습니다. import os 폴더 생성, 폴더 내 파일 출력, 파일 확장자 출력 import os # 폴더 만들기 - 상대 경로 이동 os.mkdir('test1') # 폴더 만들기 - 상대 경로2 이동 os.mkdir('폴더이름/test2') # 폴더 만들기 - 절대 경로 이동 os.mkdir('C:/project/python/test2') # 파일 오른쪽 마우스 속성 > 위치 복사 -> 붙여넣기 후 역슬래시 슬래시로 바꿔주기 os.mkdir('C:/Users/PC CAFE/Downloads/images') # 폴더가 없을때만 만들기 if no..
반응형