본문 바로가기
[php] form 전송 (GET, POST) php에서 input, form 태그를 활용한 form 전송을 알아보겠습니다. 1. 입력, 출력 화면 다를 시 폼 입력 화면 폼 출력 화면 index.php - 폼 입력 이름 비밀번호 이메일 form-act.php - 폼 출력 2. 같은 화면에서 출력시 출력 화면
[jQuery] css 가져오기 변경하기 css 가져오기 $("div").css("스타일 속성"); //$("div").css("width"); css 변경하기 $("div").css("스타일 속성". "변경할 값"); //$("div").css("width", "200px"); 예시코드 사이드바의 버튼 클릭시 토글과 같이 나왔다 사라졌다는 하는 기능입니다. $('.btn').click(function() { if ($('aside').css('left') == '0px') { $('aside').css('left', '-200px') } else { $('aside').css('left', '0') } }) 구현 화면
[css] 포스트에서 자주 사용되는 hover시 effect주기 사이트 포스트에서 많이 사용되는 hover시 style 입니다. image background가 들어가고, view more 문구가 나타납니다. HTML XXX CSS .cover-thumbnail-list-1 ul li .thum { position: relative; } .cover-thumbnail-list-1 ul li .thum:before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(255,255,255,0); transition: background-color .5s; } .cover-thumbnail-list-1 ul li:hover .thum:before { wi..
[vba] VBA selenium 기본 코드 기본 셀레니움 틀 Sub 함수명() Dim driver As New Selenium.ChromeDriver Dim keys As New Selenium.keys driver.Get "웹주소" //작업할 코드 End Sub 셀레니움 기본 코드 driver.FindElementByCss("셀렉터").Clear //지우기 driver.FindElementByCss("셀렉터").text //텍스트 가져오기 Dim keys As New Selenium.keys //셀레니움.keys 삽입 driver.FindElementByCss("셀렉터").SendKeys "키워드" //키워드 텍스트 입력 driver.FindElementByCss("셀렉터").SendKeys keys.Enter //엔터치기 driver.Find..
[vba] 네이버 쇼핑 연관검색어 크롤링 네이버 쇼핑에 검색어를 입력하면 나오는 아래의 쇼핑연관 검색어를 추출합니다. 네이버 쇼핑 연관검색어 크롤링 코드 주소 가져오기 접기 클릭 연관 검색어 FindElementsByCss로 가져와 변수에 담기 for 문으로 엑셀에 츨력하기 Sub 네이버쇼핑가져오기() Dim driver As New Selenium.ChromeDriver driver.Get "https://search.shopping.naver.com/search/all?query=%EC%9B%90%ED%94%BC%EC%8A%A4&cat_id=&frm=NVSHATC" driver.FindElementByCss("#container > div.relatedTags_relation_tag__Ct0q2 > div > button").Click Se..
notepad ++ ftp 플러그인 연결 코드에디터 노트패드++를 이용해 ftp 클라이언트 프로그램 연결을 위해 플러그인 설치 후 연결하는 방법입니다. 노트패드++ 진입 > plugins > plugins admin nppftp 검색 > 선택 > install plugins > nppftp > show nppftp window nppftp 창 > 설정 아이콘 > profile settings profile settings 팝업 > add new > hostname, connect type: SFTP, username, password 입력 ftp창에서 connect 아이콘 선택 후 해당 파일, 폴더가 뜨면 완료
[html] 유튜브 iframe 코드로 변환 ifram 변환 사이트 - 유튜브 태그 생성기 https://remindori.com/tool/youtube Tool • ReminDori remindori.com 유튜브 동영상 퍼가기 유튜브 동영상 하단의 공유 기능에서 퍼가기 메뉴를 이용합니다. 직접 소스 만들기
[jQuery] 페이지마다 해당 메뉴명 스타일 주기 페이지 접근시 해당 메뉴명에 컬러를 주려고 하였으나, 페이지가 이동할 때마다 새로고침을 하여 onclick 이벤트로 불가하여 다른 방법으로 기능 구현을 하였습니다. document.location.pathname으로 링크 주소를 가져와서, 변수에 담음 a[href*='"+link+"']: a href='xxx' xxx 에 link 의 문자열이 포함되었는지 찾기 포함되었을 경우, 클래스를 추가하여 style 적용 jQuery: $(".menu ul li a[href*='"+link+"']") javascript: document.querySelectAll(".menu ul li a[href*='"+link+"']") [attr*=value] attr이라는 특성값을 가지고 있으며, 값 안에 value라는 문..
[WEB] 페이지 소스보기 캐시 비활성화 하는법 view source 보는 법 마우스 웹사이트의 오른쪽 마우스 클릭 후 페이지 소스 보기 선택 단축키 윈도우: ctrl + u 맥: command + alt + u 캐시비활성화 하는 법 개발자 도구를 켰을때만 비활성화 됨 개발하면서 코드를 수정하면서 캐시 때문에 반영되지 않는 현상을 해결, 즉시 반영되게 할 수 있음. 개발자 도구로 이동 네트워크 > Disable Cache 체크
[xampp] apache vhost 환경설정 및 windows hosts 설정 [xampp] apache vhost, 윈도우 hosts 설정 아파치의 가상 호스트와 윈도우의 호스트를 이용하여 가상의 도메인을 내 컴퓨터(로컬)의 폴더로 잡아 주어 가상 도메인을 설정합니다. 로컬호스트(127.0.0.1) 위치c:\xampp\htdocs cmd(또는 powershell) > 관리자권한으로 실행 > windows/system32/drivers/etc/hosts 윈도우에서 powershell을 관리자 권한으로 실행하여 windows/system32/drivers/etc/hosts 경로로 들어가 hosts 파일 코드를 오픈합니다. 원래에서 바꿀 도메인으로 변경 xampp control pannel 실행 Apache > Config > [Apache] 선택 conf > extra > httpd..
자주 사용하는 터미널 명령어 자주 사용하는 터미널 명령어 폴더만들기 mkdir 폴더명 폴더삭제 rm -rf 폴더명 폴더안으로 들어가기 cd 폴더명 폴더 뒤로 돌아가기 cd .. 폴더 내부 정보 확인하기 ls -al 폴더 내 파일 생성하기 touch 파일명
[js] 브라우저 종류 확인 (navigator.userAgent) 브라우저 종류 확인 (navigator.userAgent) const mobileTypeFn = () => { const uagent = navigator.userAgent.toLowerCase() const android_agent = uagent.search("android") const iphone = uagent.search("iphone") const ipad = uagent.search("ipad") if (android_agent > -1) { //안드로이드 return 'android' } else if (iphone > -1 || ipad > -1) { //아이폰 return 'iphone' } else return 'pc' }
[js] 자주 쓰는 정규식 함수 만들기 휴대폰 번호 정규식 함수 export const regMobile = (value) => { let mobile = /^010([0|1|6|7|8|9]?)-?([0-9]{4})-?([0-9]{4})$/; if (mobile.test(value)) { return true } else { return false } } 비밀번호 정규식 export const regPass = (value) => { //영문, 숫자만 포함 6자리-20자리 let regPass1 = /^(?=.*[a-zA-Z])(?=.*[0-9]).{6,20}$/; //영문, 숫자 포함 6자리 이상 let regPass2 = /[\{\}\[\]\/?.,;:|\)*~`!^\-_+@\#$%&\\\=\(\'\"]/g; //특수 문자 체크 if (..
[js] 페이지 리다이렉트 (location.href vs location.replace) 페이지 리다이렉트 하는 두가지 방법에 대해 알아보겠습니다. window.location.href 새로운 페이지로 이동 속성 내부 히스토리에 주소 기록 저장 setTimeout(function(){ window.location.href="move.html" }, 100); window.location.replace() 기존 페이지를 새로운 페이지로 변경 메서드(함수 호출) 내부 히스토리에 주소 기록이 안됨 setTimeout(function(){ window.location.replace('move.html')}, 100); window.location.replace() 예시 window.location.replace('이동할 주소', '_blank') setTimeout(() => {window.clos..
[react] react 구글 태그 매니저 react에서는 react-gtm-module을 설치하여 구글 태그 매니저를 사용합니다. https://www.npmjs.com/package/react-gtm-module react-gtm-module React Google Tag Manager Module. Latest version: 2.0.11, last published: 2 years ago. Start using react-gtm-module in your project by running `npm i react-gtm-module`. There are 222 other projects in the npm registry using react-gtm-module. www.npmjs.com react-gtm-module 설치 npm i rea..
[db] DBeaver 설정법 새로 생성시, 왼쪽 플러그 플러스 아이콘 선택 -> 해당 database 선택 여기서 SSH로 들어감 use ssh tunnel 체크 host: ip 주소 user name: ubuntu private key에 ircc 키 ubuntu 안에서 해당 localhost로 들어감 Main 탭에서 connect by: Host Host: localhost Datebase, Usernmae, Password 입력 서버 정보 입력 후, 아래 Test Connection 으로 테스트
[mysql] sql 기본 문법 (ft. CRUD 쿼리) 테이블 구조 테이블 명: members 컬럼명: name, age, gender INSERT문 / CREATE INSERT INTO 테이블명 VALUES(데이터) INSERT INTO members VALUES( '홍길동', 20, '남'); 특정컬럼에만 값을 넣고싶을 때 INSERT INTO members (name, age) VALUES( '갓디노', 24); MySQL 문법 INSERT INTO members SET name = '홍길동', age = 20, gender = '남'; SELECT문 / READ SELECT * FROM 테이블명 [ WHERE 조건문 ] //예제 SELECT * FROM members; SELECT * FROM members WHERE age = 20; SELECT *..
[html] html5 구문 html5 구문
[py] 파이썬 실행파일 만들기 (ft. pyInstaller) GUI 없는 파이썬 실행파일 제작 폴더 생성 폴더 생성 후 python파일과, pyqt 파일 한 곳에 생성 pyinstaller 설치 1. pyinstaller 설치 pip install pyinstaller 2. 해당파일 pyinstaller 설치 pyinstaller -w -F 파이썬파일이름.py (-w:콘솔 없음, -F: 하나의 파일) GUI 포함시키는 실행파일 제작 1. .ui 파일의 절대경로를 찾을 수 있도록 코드 수정 2. pyinstaller -w -F 파이썬파일이름.py 코드 실행 3. .spec 파일 수정 4. pyintaller -w -F 파일썬파일이름.spec 저장 오류 발생: makespec options not valid when a .spec file is given 오류 발생 ..
[php] mysql, 데이터베이스 기초 예제 (ft. 테이블 불러오기) 화면 결과 mysql 테이블 mysql 데이터 db 출력하기
[py] 네이버 오픈 api 지역 검색 예제 네이버 지역 검색 오픈 api 를 이용하여 지역 원하는 데이터를 수집합니다. 오픈 API 개발 문서 먼저 네이버에서 application을 만들고, client id와 client secret 키를 발급받아야 합니다. 개발문서를 보면서 요청 url과 파라미터, 사용 방법을 확인합니다. 네이버 오픈 api 불러오기 코드 import requests headers = { 'X-Naver-Client-Id': '클라이언트 아이디', 'X-Naver-Client-Secret': '클라이언트 시크릿 코드' } query = '세곡동 맛집' params = { 'query' : query, 'display':3, 'sort' : 'comment' } search_url = 'https://openapi.naver...
[php] Warning: mysqli_connect(): (HY000/1045): Access denied for user 오류 이전 코드 로컬 호스트에서 디비 연결을 하기 위한 코드 오류 Warning: mysqli_connect(): (HY000/1045): Access denied for user 'root'@'localhost' (using password: NO) in C:\xampp\htdocs\php\index.php on line 8 해결 확인을 해보니 이전에 xampp control 에서 MySQL 실행시 3306이 이미 사용중 오류가 떠서 3307로 변경한 적이 있었는데 찾아보니 호스트에 포트를 붙여야 한다고 합니다. 변경코드
mac 현재 열려있는 포트 확인 및 닫기 mac 현재 열려있는 포트 확인 sudo lsof -i :3000 mac 현재 열려있는 포트 죽이기 위에서 나온 PID 번호를 아래 명령어에 입력합니다. sudo kill -9 PID 번호
[css] 줄바꿈, 공백, 띄우기 css 처리 (ft. white-space) white-space white space는 여백이라고 하는데 css의 white-space 속성은 문장의 공백, 공란이라고 생각하면 됩니다. 다음 줄(공백이 여러개일경우) 공백, 들여쓰기 자동 줄바꿈(영역안 처리) normal 공백 1개만 표시 공백 1개만 표시 O nowrap 공백 1개만 표시 공백 1개만 표시 X pre 공백 있는 그대로 표시 공백 있는 그대로 표시 X pre-wrap 공백 있는 그대로 표시 공백 있는 그대로 표시 O pre-line 공백 있는 그대로 표시 공백 1개만 표시 O 문장 띄우기, 공백, 줄바꿈 보여주기 연속된 공백을 그대로 표시하고, 긴 줄도 줄 바꿈하지 않고 표시 메모장 구현시 저장된 데이터를 불러올때, 사용자가 입력한 공백, 띄어쓰기 그대로를 출력해야 하므로, whi..
[css] 체크박스 스타일 커스텀 체크 박스 스타일 커스텀 체크 전 input[type="checkbox"].클래스명 { appearance: none; width: 넓이 값; height: 높이 값; background-image: url("이미지 주소"); } 체크 후 input[type="checkbox"].클래스명:checked { background-image: url("이미지 주소"); }
[js] 숫자가 정수인지 소수점인지 체크 (ft. inInteger(), parseInt()) 숫자가 정수인지 소수점인지 체크하기 Number.inInteger() 예제 Number.isInteger(3) //true Number.isInteger(0.8) //false 문자열 숫자로 반환하기, 소수점 정수로 변환하기 parseInt(value) 예제 parseInt('11') //문자열 > 숫자 11 parseInt(5.333) //소수점 > 정수 5 parseInt('-5') //문자열 -> 숫자 -5 parseInt(' ') //숫자가 안들어간 문자열, 공백의 경우, NaN 반환 NaN
[js] input 이벤트 (ft. input 박스) input박스가 이벤트 onchange focus 발생 전 후 비교하여 변화가 일어났을때 발생하는 이벤트 ... } /> onfocus focus 되었을때 발생하는 이벤트 ... } /> onblur focus가 해제 되었을때 발생하는 이벤트 ... } /> onkeypress 문자 값을 생성하는 키보드의 키를 눌렀을때 발생하는 이벤트 ... } /> 모바일웹앱(안드로이드)의 키패드에서 이동을 눌렀을 경우 if (e.key === 'Enter' || e.keyCode === 13) { //함수 코드 }} /> onkeydown 키보드의 키를 눌렀을때 발생하는 이벤트 ... } /> onkeyup 키보드의 키를 눌렀다가 떼었을때 발생하는 이벤트 ... } />
[py] 웹 이미지 저장 (ft. requests) 웹이미지 저장 이미지 주소를 복사하여 requests 라이브러리를 이용해 이미지를 저장합니다. #pip install requests 로 라이브러리 설치 #이미지 저장 import requests url = '이미지 url' #해당 url로 서버에게 요청 img_response = requests.get(url) #요청에 성공했다면 if img_response.status_code == 200: #200일 경우 정상 #print(img_response.content) print('이미지 저장') with open('text.jpg', 'wb') as fp: 결과 wb는 파일 모드를 지정 읽기(r), 쓰기(w), 수정(+), 텍스트파일(t), 바이너리 파일(b) 이미지 파일을 저장하고자 하는 것이기 때문에..
반응형

티스토리툴바