비전공자 개발일기

Learn More .button { display: inline-block; color: #3c67e3; text-decoration: none; padding: 20px 50px; border: 3px solid #3c67e3; border-radius: 10px; } .button:hover { animation: pulsate 1s ease-in-out; } @keyframes pulsate { 0% { box-shadow: 0 0 25px #5ddcff, 0 0 50px #4e00c2; } }

Loading Animation .loader-wrapper { width: 60px; height:60px; } .loader { box-sizing: border-box; width: 100%; height: 100%; border: 10px solid #162534; border-top-color: #4bc8eb; border-bottom-color: #f13a8f; border-radius: 50%; animation: rotate 5s linear infinite; } .loader-inner { border-top-color: #36f372; border-bottom-color: #fff; animation-duration: 2.5s; } @keyframes rotate { 0%{ transf..

.toggle-switch, .toggle-switch .toggle-knob { -moz-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; transition: all 0.2s ease-in; } .toggle-switch { height: 30px; width: 55px; display: inline-block; background-color: #ffffff; margin: 2px; margin-bottom: 5px; border-radius: 30px; cursor: pointer; border: solid 1px #d2d6de; box-shadow: inset 1px ..

환경 설정 1. node js 설치 - LTS(안정화) 버전 - 설치시 , npm도 같이 설치됨 2. Expo 설치 - npm install -g expo-cli https://expo.io/ Expo Expo is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React. expo.dev 3. 파일 생성 - expo init 파일명 - 3가지 선택사항이 나오는데 상황에 맞게 선택(글쓴이의 경우 blank로 선택) 4. Hello World import { StatusBar } from 'expo-status-bar'; import { StyleSheet, Te..

특정 클래스 존재 유무에 따른 jQuery 실행문 예시 BOX1 BOX2 BOX3

PHP 정보 확인 : phpinfo() 문자 표시 : PHP 상수 이름 설명 PHP_VERSION PHP의 버전 PHP OS PHP가 실행중인 OS __LINE__ 처리 중인 파일의 현재 줄 번호 __FILE__ 처리 중인 파일의 전체 경로와 이름 __DIR__ 처리 중인 파일의 디렉터리 __FUNCTION__ 함수명 __CLASS__ 클래스명 __TRAIT__ 트레이트명 __METHOD__ 클래스 메소드명 __NAMESPACE__ 현재 네임스페이스 이름 true 참 false 거짓 null 아무 값이 없음 함수 정의: define() define() -> PHP VERSION 확인: PHP_VERSION 현재 처리중인 파일명 확인: __FILE__ 처리 중인 행 번호 출력: __LINE__

Update CSS Variables with JS Spacing: Blur: Base Color :root { --base: #ffc600; --spacing: 10px; --blur: 10px; } body { text-align: center; background: #193549; color: white; font-family: 'helvetica neue', sans-serif; font-weight: 100; font-size: 50px; } .h1 { color: var(--base); } .controls { margin-bottom: 50px; } a { color: var(--base); text-decoration: none; } input { width: 100px; } img{ pa..