전체 글

PHP, MOBILE, WINDOWS, HYML, CSS, JAVASCRIPT, SERVER, MYSQL, APP, PROGRAM, IT 정보
Web/PHP

freegeoip.app API를 호출하여 IP 주소의 국가, 위도 및 경도를 가져오는 코드

무료 IP 지리 정보 서비스인 freegeoip.app를 사용하여 IP 주소로 국가 코드, 국가 이름, 지역 코드, 지역 이름, 도시, 위도 및 경도, 타임존 정보를 가져올수 있습니다. 아래 코드는 PHP를 이용한 코드입니다. 아래는 Python을 사용하여 예시를 보여드리겠습니다. 다음 코드는 requests 라이브러리를 사용하여 freegeoip.app API를 호출하여 IP 주소의 국가, 위도 및 경도를 가져오는 방법을 보여줍니다: import requests def get_ip_geo(ip_address): url = f"https://freegeoip.app/json/{ip_address}" response = requests.get(url) data = response.json() country..

Web/PHP

CKEditor5 클립보드 이미지 업로드 하는 방법(Paste, Ctrl+v)

1. CKEditor5 클립보드 이미지를 서버에 업로드 CKEditor5의 clipboardInput 이벤트를 사용하여 붙여넣기된 콘텐츠에 이미지가 있는 경우 이미지를 서버에 업로드할 수 있습니다. 이미지가 있을 때 해당 이미지를 서버에 업로드하고, 서버에 업로드된 이미지의 URL을 콘텐츠에 삽입하는 방법을 살펴보겠습니다. ClassicEditor .create( document.querySelector( '#editor' ) ) .then( editor => { // clipboardInput 이벤트 리스너 등록 editor.editing.view.document.on( 'clipboardInput', async ( evt, data ) => { let clipboardData = data.dataTr..

Web/PHP

PHP) 주어진 시작일자와 종료일자 사이의 남은 일 수를 계산하는 방법

아래 PHP 함수는 주어진 시작일자($s_date)와 종료일자($e_date) 사이의 남은 일 수를 계산하는 기능을 합니다. 함수는 다음과 같은 단계로 작동합니다: $e_date가 빈 문자열인 경우, 즉 종료일자가 제공되지 않은 경우에는 "0"을 반환합니다. 시작일자와 종료일자를 각각 연, 월, 일로 분리하여 배열로 저장합니다. (explode 함수를 사용하여 문자열을 구분자(여기서는 "-")로 분리합니다.) mktime 함수를 사용하여 시작일과 종료일의 타임스탬프를 생성합니다. 이 함수는 연, 월, 일, 시, 분, 초를 기반으로 타임스탬프를 반환합니다. 시작일의 타임스탬프($s_time)와 종료일의 타임스탬프($e_time)를 비교하여 시작일이 종료일보다 늦은 경우 0을 반환합니다. 즉, 시작일이 종료..

Web/PHP

PHP) 그누보드에서 스마트에디터/ckeditor 에 링크를 입력할 경우 target 값 없이 입력이 될 경우

그누보드에서 스마트에디터/ckeditor 에 링크를 입력할 경우 target 값 없이 입력이 될 경우 HTML을 파싱하여 href 속성이 있는 경우 등록된 본문 내용이 허용된 도메인과 다를 경우 target 속성 추가

DataBase/Mysql

MySQL에서 계층 적 데이터 관리하기

출처 : https://hmjkor.tistory.com/472 MySQL에서 계층 적 데이터 관리하기 원문 : http://mikehillyer.com/articles/managing-hierarchical-data-in-mysql/번역 : 구글번역 소개(Intorduction) 한 번에 또는 대부분의 사용자는 SQL 데이터베이스에서 계층 적 데이터를 처리했으며 계층 적 데이터의 hmjkor.tistory.com 원문 : http://mikehillyer.com/articles/managing-hierarchical-data-in-mysql/ 번역 : 구글번역 소개(Intorduction) 한 번에 또는 대부분의 사용자는 SQL 데이터베이스에서 계층 적 데이터를 처리했으며 계층 적 데이터의 관리는 관계..

Web/JavaScript

선택 상자/텍스트 입력 플러그인 Choices.js

바닐라, 경량(~19kb gzipped🎉), 구성 가능한 선택 상자/텍스트 입력 플러그인. Select2 및 Selectize와 비슷하지만 jQuery 종속성이 없습니다. CountUp.js는 모든 브라우저를 지원합니다. https://choices-js.github.io/Choices/ Choices choices-js.github.io

Web/JavaScript

카운트하여 숫자 값에 애니메이션을 적용하여 데이터를 표시하는 CountUp.js

CountUp.js는 보다 흥미로운 방식으로 숫자 데이터를 표시하는 애니메이션을 빠르게 만드는 데 사용할 수 있는 종속성 없는 경량 Javascript 클래스입니다. 그 이름에도 불구하고 CountUp은 전달하는 시작 값과 끝 값에 따라 어느 방향으로든 계산할 수 있습니다. CountUp.js는 모든 브라우저를 지원합니다. https://github.com/inorganik/CountUp.js GitHub - inorganik/countUp.js: Animates a numerical value by counting to it Animates a numerical value by counting to it. Contribute to inorganik/countUp.js development by crea..

Etc

디자인 협업 도구 Pixso

차세대 디자인 협업 도구 팀 단위로 훌륭한 제품을 만들고 실시간으로 디자인, 프로토타입 및 피드백을 수집합니다. Pixso에서 다양한 포맷 가져오기 지원(Figma, Sketch, Axure, Pixso, XD, SVG)으로 도구 전환이 필요 없습니다. 실시간 협업 같은 대상에 초점을 맞춥니다. 복잡한 디자인 프로젝트를 할 때 링크를 통해 팀원들을 요청하여 클라우드 협업 디자인을 진행하며, 글꼴, 테두리, 색상 등 다양한 디테일을 실시간으로 동기화합니다. 지능형 UI 디자인 도구 전문 기능을 빠르게 습득합니다. 전통적인 디자인은 많은 도구에 의존해야 효과를 기대할 수 있습니다. 반면에 Pixso는 자체 구성 요소 변형, 자동 배치 등 전문 디자인 도구를 갖추고 UI/UX 디자인과 프로토타입 재생을 지원하..

React Native

Locofy.ai - Figma 를 React, React Native, HTML/CSS, Next.js 코드 변환

Locofy.ai는 선택한 언어로 모바일 앱 및 웹용 프로덕션 준비 코드 를 작성합니다! 더 복잡한 문제에 집중할 수 있도록 시간을 50~60% 절약할 수 있습니다. React, Vue, Angular, HTML-CSS, SwiftUI , Jetpack Compose/Kotlin, Flutter, React Native 등이 준비되어 있습니다! 코드를 내보내거나 Netlify로 배포하세요. 이미 사용하고 있는 도구를 계속 사용하십시오. 우리는 Figma, Sketch 및 Adobe 와 통합 합니다. 플러그인 또는 빌더를 사용하여 디자인에 태그를 지정하고 짜잔! 보너스로 Material UI, Bootstrap, Ant Design 및 기타 인기 있는 라이브러리 에서 미리 빌드된 구성 요소 를 끌어다 놓을..

Etc

linux, mac, win에서 사용 가능한 terminal/ssh/sftp 클라이언트

electerm은 electron/ssh2/node-pty/xterm/antd/subx 및 기타 여러 라이브러리를 기반으로 하는 터미널/ssh/sftp 클라이언트(linux, mac, win)입니다. https://electerm.github.io/electerm/ electerm electerm.github.io

React Native

react-native splash 0.68 + 이상 버전에서 에러 처리 방법

Make로 작업하시는 분들에 한해 에러 처리 방법입니다. Make를 사용안하시는 분들은 1단계 방법추가하시고 SplashScreen.show(this, R.style.SplashScreenTheme, true); 3번째 매개변수 전달하면 됩니다. react-native-splash-screen 설치 yarn add react-native-splash-screen react-naitve link react-native-splash-screen @bam.tech/react-native-make 설치 yarn add @bam.tech/react-native-make react-native set-splash --path 경로 --resize center --background 색상 하시게 되면 아래와 같이 M..

React Native

react-native webview 영역이 사라질 경우 앱 꺼지는 문제

react-native 에서 WebView 사용시 일부 기기의 Android에서 충돌로 인해 앱이 강제 종료가 되는 문제가 발생 style 속성에 opacity:0.99, minHeight:1를 추가를 하는것으로 해결이 가능하지만 정상적인 해결 방법은 아닌것 같다

Web/CSS

flex 속성을 이해하기 좋은 사이트... Flexbox Froggy

Flexbox Froggy에 오신 것을 환영합니다! Flexbox Froggy는 Froggy와 친구들 돕는 CSS 코드 게임입니다. 오른쪽의 justify-content 속성을 이용하여 개구리가 수련잎으로 이동할 수 있도록 도와주세요. 이 속성은 다음의 값들을 인자로 받아 요소들을 가로선 상에서 정렬합니다 flex-start: 요소들을 컨테이너의 왼쪽으로 정렬합니다. flex-end: 요소들을 컨테이너의 오른쪽으로 정렬합니다. center: 요소들을 컨테이너의 가운데로 정렬합니다. space-between: 요소들 사이에 동일한 간격을 둡니다. space-around: 요소들 주위에 동일한 간격을 둡니다. http://flexboxfroggy.com/#ko Flexbox Froggy A game for ..

Web

포스트맨 사용시 url 변경할 때 사용하기 좋은 팁... 전역변수 설정

포스트맨 사용시 API url, token, 테스트 아이디를 변수화하여 처리하는 방법입니다. 최근 프로젝트 중에 개발자서버(cafe24)를 사용하다가 서버이전(AWS, NCloud 등)으로 이전시에 편하게 Url을 수정해서 사용할 수 있는 방법입니다 귀찮은 상황이 생길시 fix해두고 편하게 사용할 수 있습니다 (프로젝트 포스트맨을 생성할때 셋팅을 해두시면 두고두고 후회 안할 팁입니다) 1. 우선 'Collection'탭에서 프로젝트에 해당하는 폴더를 생성하면 우측 상단에 'No Environment'라고 표시가 됩니다. 2. 'Collection'탭 아래에 'Environments'탭을 클릭해주세요. 3. 기본으로 'Globals'가 있으며, '+'버튼을 눌러 새로 생성할 수 있습니다. 'Globals'..

Os/Linux

Oneinstack - 웹서버 APM 자동 설치 스크립트

This script is written using the shell, in order to quickly deploy LEMP/LAMP/LNMP/LNMPA/LTMP(Linux, Nginx/Tengine/OpenResty, MySQL in a production environment/MariaDB/Percona, PHP, JAVA), applicable to CentOS 7 ~ 8(including redhat), Debian 8 ~ 11, Ubuntu 16 ~ 21, Fedora 27+ of 32 and 64. OneinStack 구성 lnmp(Linux + Nginx + MySQL/MongoDB + PHP) 램프(Linux + 아파치 + MySQL/MongoDB + PHP) lnmpa(Linux + ..

projin
웹인스토리