코딩공부

CSS / javascript 연결 선택자 잡아내기 - DOM을 조작하는 자바스크립트 html js HTML 영역에 "조작성공!" 텍스트 대입

네비게이션 3종류GNB 글로벌 네비게이션 : 항상 노출 (위쪽)LNG 로컬 네비게이션 : 특정 페이지 (왼쪽)CNB 컨텐츠 네비게이션 : 컨텐츠 분리 (탭처럼 숨어있는 것)header\`\`\`headerheader\`\`\`header .container h1 >

스타일 우선순위 : 태그 부트스트랩 (공통 클래스 최적화) 후손선택자 : 공백으로 표기 자손선택자 : 에밋과 동일 ( '>'로 표기 ) 선택자 : 바로 아래에 위치한 (동생) 태그 하나 ~ 선택자 : 나를 제외한 동생'들' :nth-child(순번) :

min-width : 최소 너비 max-width : 최대 너비 1rem : 매체가 가진 기본 폰트 1vw : 화면 너비의 10분의 1 (for 반응형) 1vh : 화면 높이 기준으로 (for 반응형) html CSS position (+top left right

(1) Free Open Source CDN for reset-css https://cdn.jsdelivr.net/npm/reset-css@5.0.1/Looking for a nice landing page for your package? https:

눈누 사이트 https://noonnu.cc/ 에서 Gmarket Sans 다운로드 CSS에 @font-family{ } 적용 HTML CSS 1 CSS 2

it's 컨텐츠 (width 안 먹힘 & style 적용 어렵)검색순위글자 관련 스타일은 전부 가능 (text-center 가운데 정렬 등)h1~h6 / span / strong / form / input / a / button / select / em / p / im

1단 메뉴 공통클래스 .container 빼고 세팅하라. 공통클래스는 언제 사라질지 모름.공통클래스 빼버리는 순간, 선택자 설계가 안 맞아 스타일 날아감!2단 메뉴 header---누구든지 쓸 수 있는 클래스공통클래스 .container 빼고 세팅하라. 공통클래스는 언

reset cdn HTML 로 만든 결과물 reset cdn 추가 공통 클래스 (CSS 스타일 추가)

HTML reset cdn 공통 클래스 (CSS 스타일 추가) CSS 스타일 추가 1. :hover 마우스 올리기 + transition: 0.5s 2. padding, border-radius ![](https://velog.velcdn.com/images

\*\*\*\*

힌트height: 160px;height: 0;transition: 0.5s;overflow: hidden; // 넘치면 막는다! overflow //애니메이션 사용하려면 auto이거나 display:none display:block 등 수치가 안되는 것 지워야!

항상! <블록 태그> 안에 <인라인 태그>를 넣어야 함a\*4 (X)li\*4>a (O)1단메뉴 header2단메뉴 headerheaderheader4-4. position: absolute의 부모 태그에 position: relative; 지정완성품 다시보

링크가 비워져있는 a 태그는 화면에 보이지 않도록 지정alt 태그가 비워져있는 img 태그는 화면에 보이지 않도록링크가 비워져있는 a 태그의 커서는 화살표 모양으로

에밋을 세팅하는 첫번째 방법header에밋을 세팅하는 두번째 방법 - 포함 관계 안에서 복붙/탭headerulul.abs.d2>li\*5>a{소메뉴}1\. href 블록설정 -> crtl F\*\*2. href="

1. reset cdn + 공통 클래스 2. CSS, 자바스크립트 연결 3. HTML

현재 사이즈에서 1rem 깐다 (calc 단위가 틀릴 때! 빼기 기호로 표기)svg는 이미지와 달리, px 개념이 아니고, 비율 계산함<a href="<img src="./img/logo.svg" alt="" class="d-block">\*\* \`\`\

HTML\+) .d2가 아닌, li에 :hover!li 높이(2.4rem) \* 5 (소메뉴 갯수) + 3 (padding-top 1.5rem + padding-bottom 1.5rem)li 높이 = 폰트사이즈 1.2rem \* line-height 2 = 2.4rem

HTMLCSSreset cdn + 공통 클래스CSS 스타일

가상 선택자가상선택자는 스타일로만 존재 (요소검사로만 확인됨!)컨텐츠이므로 '인라인 성향' (인라인스타일이 먹힌다!)body의 클래스 popupShow에 ::before 지정클래스 .popupShow가 생기면 -> 가려졌던 화면이 나타난다HTMLCSSCSSdiv를 좌우

정답(1) body::before(2) body.popupShow::before(3) body (4) body.popupShow \`\`\`

left: -100vw; width: 100%; ----> left:0; right: 0;left: 0; --------------------------> height: 100%;transform: translate(-50%, -50%); -----> transform

$('CSS 스타일 선택자와 동일')제이쿼리 선택자 == CSS 스타일 선택자가상선택자는 제이쿼리 선택자가 될 수 없다!예시) $('a.d1:not(.first)')동사(구체적인 처리)addClass(클래스 추가), removeClass(클래스 지움), toggleCl

ㅇ

HTMLCSS1\.2\.4\. z-index: 10;5\. 제이쿼리 값div 클래스 .show 추가

for 여러 사람과 협업 / 작업내역기록(과정, 개발사고방식 확인)CLI 환경 (커맨드 라인 인터페이스/터미널)<-> GUI 환경 (그래픽 유저 인터페이스/패키지 이용)git clone 깃허브 주소(https://github.com/\~\~\~\~~)&l

1. 폰트 어썸 링크 붙여넣기 2. button 안 삼지창 아이콘 (i 태그)

HTMLCSSflex-direction: column;justify-content: center;align-items: center;transform: translateX(-100%); 네 너비만큼 왼쪽으로 들어가제이쿼리 - \`\`\`

부트스트랩 4.6버젼https://getbootstrap.com/docs/4.6/getting-started/introduction/HTML에 링크 붙여넣기< link rel="stylesheet" href="https://cdn.jsdelivr

순서 요약(1) git init(2) git ignore(3) git configcd..mkdirgit init (깃.git이라는 투명한 폴더가 생김)<사용자 등록>git config user.name 4\* \* wgit config user.email 4 \*

헤더 배치순서1\. 검색최적화 SEO / 광고수집자바스크립트 / 바로가기 (favicon.ico)폰트웹표준프레임워크 or 플러그인 (부트스트랩 v4.6)CSS 커스터마이징 스타일(1) 일러스트레이터에서 아이콘.png 작업 (favicon.png)(2) convertic

.container>ul.d-flex.w-100>li.col-6+li.bestP.col-6.titleImg>imgul.threeList>li\*3>a>img+span.icon+strong.name+span.send+span.price인라인 태그라서 여유만 있으면 위로

HTMLCSS가운데정렬width:100; justify-content: center; 가로 너비 있어야 가운데 가지height: 100vh; align-items: center ; 엄마 높이 있어야 애들이 가운데 가지li 사이사이 여백주기 { margin: 0 2re

edit as HTML예시)웹표준 부분을 복사합시다v 좌우 끝 여백 없는 게 포인트!

SEO 최적화메타태그 / 검색최적화 SEO / 광고수집자바스크립트 / 바로가기shortcut 아이콘 (favicon.ico)폰트웹표준프레임워크 or 플러그인 (부트스트랩 v4.6)커스터마이징 스타일 style.css....커스터마이징 jsmeta 태그 (검색최적화 SE

1-1. display: none 1-2. d-none 1-3. 자바스크립트가 연결된 객체 숨기기 2. body 섹션을 Header란에 옮겨넣기 ![](https://ve

나만의 소스를 유지/보수/관리할 줄 안다 (이미지, style 자바스크립트 삽입 위치)협업을 위한 소스들의 효율적인 디지털 네이밍을 할 수 있다(link href="vendor/animate.css/animate.min.css?ver=3.5.1" 플러그인 버전을 노출시

휠이 닿자마자 터진다 + delay 걸어서 순서대로 페이드인 하는 효과 가능!이게 자바스크립트가 아니라 CSS! 복사해서 태그에 붙여써라 https://animate.style/aos 플러그인 https://michalsnik.github.io/aos

상품이름 안 보임. 장애인 사용자가 들을 수 있도록

필수 요소들만 남겨두고 지우는 습관을 들이자메타 태그(광고)폰트 : 구글폰트 & 아이콘(폰트어썸/xeicon)부트스트랩플러그인(animate.css / device-mockups 등)나의 커스터마이징 CSS...나의 커스터마이징 javascript모든 웹에서 동일하게

\+) 폰트 사이즈 늘려서 상단 메뉴 글자 간격 넓히기完

container - row - col은 패키지다!캡쳐 없음. 알아서 구역별로 옮겨넣으시라before↓↓↓afterli는 원래 블록형 태그

class="position-absolute"유투브 영상은 외부 컨텐츠라서, 내가 이래저래 가지고 놀 수 없다. 그러니 포지션 앱솔루트width="100%"반응형 위해 너비 100%, 높이는 주지 않는다.class="position-relative"유투브 영상은 외부

나의 폰트 변수를 root 변수로 지정폰트 적용하기 (+폰트 반응형 처리하는 방법)

Sass v1.8.22 SylerLive Sass Compiler Glenn Marksvscode-live-sass-compiler 구글링해서 소스 붙여주기소스 붙여넣는 방법 : json. 형식을 맞춰라!저장할 때마다 컴파일을 반복 반복한다.scss.min.css :

후치연산 num++ (= 예약)1씩 증가 (단, 지금 나 자신에게 더하지 않고, 뒤에 오는 나=num에게 준다)전치연산 ++num 지금 나 자신에게 1을 추가한다 (num+=1 혹은 num=num+1)터미널에서 확인하면 최종 num 값이 4로 나옴setInterval

바닐라 JS에서는HTML을 먼저 만들고,그걸 Javascript로 가져와서 HTML을 수정한다 ex) getElementById( 'id' )리액트 JS에서는모든 것이 자바 스크립트에서 시작 → 그 다음에 HTML이 된다.자바 스크립트로 element 생성리액트가 그걸

리액트 어플리케이션을 렌더링 해줄 index.jsWelcome back!!!을 렌더링해줄 App.js

웹호스팅/도메인 종류 : 닷홈, 카페24, 미리내, 아마존 CMS 등웹 사이트 운영자들이 파일&폴더들을 관리/수정하기 위해 FTP를 이용하는데,FTP 중 무료+가장 유명한 프로토콜 = 파일질라서버에 있는 코드/파일을 직접 열어보고 수정하고 싶다면, FTP(파일질라)를

(첫번째는 카페24가 무료로 깔아줌)두번째 그누보드 수동 다운로드 https://sir.kr/g5_pds/6669폴더명 교체 (ex. kowpa)vscode에서 열기sftp 호출 -> 서버연결(구름아이콘)그누보드5 설치 -> 그누보드 폴더(commo.php파일

그누보드5 테마 https://sir.kr/g5_theme(바탕화면 폴더 or 파일질라에서 작업 가능)배경 수정로고 수정하기하단색상변경+하단sns컨텐츠없애기astore portfolio 섹션삭제활성화컬러수정폰트 본고딕으로수정하단카피문구: 우리플랫폼 -> '내이

www == 도메인 == 루트 디렉토리

백엔드 언어, 화면에서 볼수 없다가장 바깥쪽 index.html에 작성해야 함반드시 복붙했을 때 공백여부 확인할 것!HTML 영역 안에 세입하는 서버언어 php 작성http://------.dothome.co.kr/ 링크 클릭 하면http://----

head.php / index.php / tail.php일러스트 save as - svg내가 쓸 이미지들 걍 www 바로 아래에 img 디렉토리 생성해서 다 집어넣기결과물생각해보기) 반응형 테마로 해야하므로 -> 모바일버전이 사용되지 않게 어떻게 해야할까?

그누보드 자체 변수제목 변수 subject내용 변수 contentindex.html (= 도메인만 치면 들어가는 페이지)html 폴더 안에 있는 첫페이지, index.htmlex) 나의 소개페이지 포트폴리오 이동index.phpex) 그누보드 골뱅이 페이지서버에서 읽어

ex) if( G5_IS_MOBILE 만약 모바일이면 ){}

부트스트랩3으로 작업한

node -v (짝수버전 only)16.18npm -v (노드를 실행하는 명령) (node_modules)8.19.2ex) 리눅스 명령npx create-react-app sjy_work -> (프로젝트명 폴더) 실행하라ycd sjy_worknpm start (이걸로

스와이퍼 https://swiperjs.com/get-startedhttps://swiperjs.com/get-startedHTML 복붙 https://swiperjs.com/swiper-apiCSS cdn 복붙 - Use Swiper fro

swiper & aos 플러그인 - 순수 자바스크립트 가벼운 플러그인부트스트랩4 https://getbootstrap.com/docs/4.6/getting-started/introduction/스와이프 https://swiperjs.com/get-st

modifier함수로 count 데이터를 업데이트 후↓컴포넌트 전체를 재생성(리렌더링)해 화면에 노출useState의 결과값 = 배열하지만 배열 상태 그대로 사용하는 건 보기 불편하잖아그러니까 순서를 뒤집어라!데이터를 업데이트 후 자동으로 리렌더링하는 modifier

Q) 두 개의 버튼에 (style을 지정한) 하나의 함수를 연결하고 싶다고 하자."Save Changes", "Continue" 버튼마다 일일이 함수 만들고 스타일 지정 ㄴㄴ (길어)하지만 버튼에 적힌 text는 달라야! (공유 X)A) 부모 컴포넌트( App함수 )로

dependency

서버/php에서 데이터베이스를 받아 -> js 배열에 저장 -> CSS나 HTML에 전송/출력 배열 + for -> DB 다루는 핵심!연산식 있어(i++) 내가 제어할 수 있다!초기값 0 ; i가 3보다 작은 조건 ; 그 동안 증가하겠다 ( 조건=false되면 끝! )

li을 자바 스크립트로 밀어넣고 (어제처럼)&제이쿼리+CSS로 애니메이션 주기! (자바스크립트로 하면 비효율적)제이쿼리 $(document).ready(function( ){ } : 여러개 세팅 가능자바스크립트 window.onload.function( ){ } 와 같

(지금까지 한 것) 제이쿼리 책갈피 기능자세한 과정은 21일차 https://velog.io/@la_sta/21일차-자바-스크립트HTML 섹션에 id 삽입전체코드전체코드

링크 복붙해서 쓰면 사파리/아이폰에서 깨진다! 반드시 내장해야 함!

도메인을 치면 바로 나의 소개 페이지 노출될 것seo최적화, 바로가기, 파비콘처리할것 스와이퍼, AOS , 제이쿼리 2.X버전, 부트스트랩 4.6 CDN아이콘폰트선택 (구글아이콘, 폰트어썸, XEICON 선택)logo SVG 이미지 혹은 배경으로 처리 ( 최상단 네비

제이쿼리에서 제일 많이 쓰는 메서드 암기!오늘의 미션반드시 서버 업로드한 주소 (절대 Live Server로 보지마)모든 소스는 서버 절대경로 /로 시작해야함제이쿼리 2.X 버전부트스트랩 4.6으로 + 가급적이면 자신의 하드코딩 스타일이 적어야함 \-> 커스터마이징이

네비의 margin 다 제거!\-> \*\*\-> 네비의 자식( 로고, ul li )들 한방에 조정!

^ 시작$ 끝 \*어디라도$( 'a\[href="\`\`\`ex) gif 이미지는 나타나지 마용법 메서드( )addClass / removeClass / toggleClassappend : 앞에서 들어간다preppend : 뒤에서 들어간다offset (top, left

$('$('$('$('$(\`\`\`\`제이쿼리 실행문는 사실 (document).ready 생략가능자바스크립트(1) 변수 선언(2) 변수에 객체들을 집어넣은 다음(3) 변수 삽입

HTML전체보기 있어서 한방에 다 펼쳐지도록 (번갈아 터뜨리는 것에는 반드시 if-esle + 변수)3-8. 전체닫기

CSSJQ활용 예시웹에서 요소검사결과서브페이지라면 배경색 red+글자색 white메인 페이지라면 배경색 \~\~~바닐라 자바스크립트제이쿼리바닐라 자바스크립트제이쿼리이 식을 수정해보세요정답

빠른 디지털 사후관리(유지보수)를 위한 html5 자바스크립트 : data옵션 다루기자바스크립트를 위한 시나리오화면에 버튼 2개가 있다.첫번째 버튼 클릭 시 -> 화면 배경색 red두번째 버튼 클릭 시 -> 화면이 원래대로 돌아옴.btns>buttonHTMLdata-변

첫 글자는 대문자로비슷한 객체를 여러 개 만들 때, 붕어빵 틀처럼 찍어낼 수 있음new 연산자를 사용해서 호출Object.assign( ) : 객체 복제Object.keys( ) : 키 배열 반환Object.values( ) : 값 배열 반환Object.entries(

이미지 좌표 따는 사이트 http://www.spritecow.com/이미지로 보이지만, UI처럼 메타태그에 안 걸림!CSS 백그라운드에 이미지 replacement 처리 (마우스 롤오버 시, 색깔만 바뀌는)HTMLCSS결과물

페이지 구분컴포넌트 (각 섹션)프레임(섹션 안의 컨텐츠 구분)텍스트/이미지 요소플레이 버튼 눌러서 링크 보내면 된다 (원본ㄴㄴ 뷰어)모바일디바이스 너비 320px로 먼저 제작이미지 최대 1080 ~ 최소 800데스크탑1920px래스터 이미지는 1:1 사이즈로 정확하게

피그마 사용법AOS 플러그인 튜닝가능!키프레임 시나리오중앙에서 검정선이 옆으로 1초 동안 서서히 나타난다이 선을 기준으로 타이틀 글자가 위로 서서히 올라가고(animate), 작은 타이틀 글자가 아래로 서서히 나타난다 (animate)

자바스크립트 애니메이션 (ft.웹기능사시험 대비용)제이쿼리 cdnjscss스와이퍼처럼 3겹으로 감싼다.banner (할머니)너비 : 1200px;overflow : hidden;.aniBox (엄마)display : flex;width : 10000px 너비 없으면 1

어제에 이어 HTML CSS 기본 세팅aniBox 자식div data 변수지정 값이 바뀌어도 일일이 수정할 필요 없음fade 시나리오를 먼저 생각하라포지션 abe / reldiv 영역 123을 포개놓는다!포개놓은 div 영역 123이 번갈아가며 등장한다!.show가 a

웹 기능사 시험볼 때, 가장 먼저 공통 클래스 지정!

node -v가 낮으면 npm이 안 돌아간다!ex) 컴 사양이 낮으면 고사양 겜 안 깔리잖아npx 리액트 설치하는 것만 얘가 담당(무거워서 따로 뺌. 리액트 설치후 삭제됨)npm 나머지는 다 얘가 한다 (노드 소스를 이용해 집행/삭제/설치)리액트를 구동시키는 플러그인

index.html 정적페이지 (페이지 소스보기)여기에는 리액트가 지원하지 않는 플러그인만 삽입 (JQ 부트 스와이퍼는 npm 설치)슬릭슬라이더, SEO 최적화, 바로가기, 폰트, 파비콘 등index.js 거의 안 건드림. App.js / App.css에서 작업하지pu

for구문for.eacharray도 객체도 다 직접받음앞자리 매개인자 ( 값array, 순번 ) ㄴ el = 각각의 cate {객체}

npm start까지 마친 상태\+) 리액트6 정보는 2021년 이후 것으로!npm install react-bootstrap bootstrapimport 'bootstrap/dist/css/bootstrap.css';부트스트랩 폴더가 생성됨

SEO 최적화(기종별) 바로가기는 manifest.json에\+) 컨텐츠 섹션별 컴퍼넌트 세팅 (헤더 & 푸더 & 슬라이드)header퍼블릭에 CSS 만들고, index.html에 연결 ㄴ> 리액트 컴파일이 필요없는 소스( ./css/millet.css)는 퍼블릭 안에

리액트각 섹션별로 컴퍼넌트 분리 + 임포트 후 호출ex) 자소서 예시 - 상단/하단/사전인터뷰/포트폴리오/기술력플러그인 설치 : 스와이퍼 / AOS / 부트스트랩4,5부트스트랩 4,5 - CSS (cdn복붙) & JS (설치!)public/index.html 부트스트랩

hd.scss - public방에 css폴더 걍 만들지말고, 컴퍼넌트별 .scss 만들라Simple Reactjs snippets 리액트 함수형 컴포넌트 자동완성! 편함!ffc Function Component 자동생성됨부트스트랩 임포트하면 비로소 d-flex 적용됨!

<일반 함수 선언 "어떻게 처리해줄까?" / 메서드>'선언적 함수' 위치에 상관없이, 어디에 써도 먼저 브라우저가 번역함=레드카펫독립된 함수 & 이름 있다 ('millet' / 겹칠 수 없음)대소문자 구분함

타이머 다 만들고 끝!이 아니라, "이걸 어떻게 쓰지?" 를 고민할 것onClick = { addCount 함수 }console.log( e.target )

1. 자바스크립트 오브젝트 다루기 1-1. 배열 생성 1-2. 배열 안에 객체 삽입 (key : value)

HTML 웹 (인터프리터 방식)태그가 한줄한줄 브라우저를 읽으며(=번역하며)..\-> img 방에 가서 logo.jpg\-> 폰트 필요해.. 구글에서 폰트 가져와 적용public방 '소스' - css, js, img 등 소스들이 항상 웹에 들러붙음 (매순간 갖다 써야

내 vscode 안의 자료가 아닌, 서버에 있는 내용을 가져와 연계(비번 빼먹은 상태서 캡처함)결과물/load/content.php결과물

제이쿼리 ajax 틀 있으니까 항상 그거 복붙해서 써라type : 'GET'get 방식 - "가져옴" (가볍게 가서 무겁게 돌아온다)(post보다 덩어리 큼)(ex.게시판 목록 페이지 방식 - get으로 밖에 있던 목록/글작성자 끌고들어와 화면에 뿌림!\_

![](https:

import React, {useState} from 'react';원시 data : 값 string, 123, null, undefined, true/false배열/객체 : '위치 좌표'만 '값'으로 인식 (그래서 useState 예시설명들 다 간단한 값 사용)con

자바스크립트 외부연동내가 짠 에밋.. 공부좀해이꼴나잖아정답정답 비주얼공부하기

질문vscode 내컴퓨터에서 작업하던 aajj.html을 upload file(=서버에 올리면)작업하던 aajj 폴더 밖으로 나가 www 밑에 파일이 저장됨& 여기서 작업이 계속 진행돼서, 정작 본 aajj 폴더 작업분이 서버 업뎃 안됨;답변 : 정답은 remotePa

처음부터 다시 해보기

어제까지 인터페이스! + ajax로 DB 만들어 자바연결하기!에밋짜는게 제일 어렵다! 무식하게 뿌시고 다시! 다시! 다시 만들어!"CJ몰 칠성몰 배껴봐야지~ 슬라이드 무조건 넣어넣어, DB 연결!"비동기통신 : 어제 한 곳 이후부터 시작합니다!tab.jsiconCs :

'서버가 없는 리액트' (+서버/노드,sql 필요)"인터페이스와 data 바인딩" (데이터-본체 분리! 빠른 유지보수/최적화렌딩)아마존/우분트(월4만원) \*서버 필요한데, 없다면... 깃페이지 만들기! ex) AOS : 실존하는/렌딩되는 깃

내주소/ajaxPage/data/db.json

HTML nav식(강사님이 준거)sjy.js ajax 작성식 옮겨navi.json 내용추가json에서 노출여부 설정 - item.isNav가 true일 때만 실행!결과물

출처 https://github.com/jaychive이걸 베이스로 요래조래

제목 : 기획하는 개발자, 000 소개 페이지설명 : "코드는 깨끗하게 짧게 자신있게!"빠른 유지보수, 성능 최적화를 위해 데이터바인딩 처리했습니다.기획의도 : - 툴 : vscode, figma, photoshop스택 : HTML5 CSS3, Bootstrap v5,

\+) 부트스트랩 v4.6 플러그인\+) js 파일 따로 빼서 외부연동결과물

전화번호는 배열로 받기 (순서가 있는 숫자)submit 버튼이 그림label for=""과 id="nm 연결"

이렇게 만들어보자라벨 안에 가상선택자를 활용하여 폼태그 디자인체크박스는 none?

화면에는 안 보이는데, 태그로는 존재함. 왜?시스템상에서 중요하지만, 보일 필요는 없어서. (자바스크립트에서 접근해서 넣기)

광고 중이라서이미지 태그 삭제 불가! (이미지 클릭한 걸 자바스크립트가 정보 수집...?)반응형으로 제작하는데, 목록배열 규칙패턴 있음 (5, 3, 5, 3)ㄴ 3번째 상품은 화면 100%로 노출되어야 함부트스트랩 붙이고 시작배열/객체, 아무것도 없을 땐 for! (f

max-width 줘서 이 이상 커지지 않게 한 다음, 반응형!body에 .show 추가된 것 확인

입력된 값이 없으면 숫자 넣으라고 경고창 띄우기input 넣은 숫자를 단으로 ul에 뿌리기내가 한 것값을 숫자로 평가할 수 식 여부를 나타내는 부울 값을 반환합니다.전체 식이 숫자로 인식되는 경우 IsNumeric은True를 반환합니다. 그렇지 않으면 False 를 반

.on 메서드로 클릭 이벤트 : 이벤트를 동시에 여러개 받는 방법.on 메서드 : click 혹은 submit 두가지를 다 받을 수 있다지정한 선택자를 가진 첫번째 요소의 속성값을 가져온다속성에 접근해서 true / false를 가져옴ㄴ prop / hasClass /

2\. 그누보드(myphpadmin)

그누보드 게시판내용이 바뀌거나 추가될 수 있다 (DB 차곡차곡 누적)사용자들은 못 쓰지만, 관리자는 글씀게시글 작성 후 메뉴설정란에 링크복붙 & 댓글창 등은 d-noneex) 공지사항ex) 회사연혁 : .... 2018 2019 2020 2021 2022....→ 바디

그누보드 : 백엔드 언어로 만들어진 '프레임워크'(=/=백엔드) ex)워드프레스접두어\_write(게시판)\_gallery(아이디)접두어\_write(게시판)\_notice(아이디)백엔드에 전달할 정보 : DB명 / DB테이블 / 접두어 / DB아이디 / DB패스\*

define ('변수') 선언대문자로 지정정의값! (일반변수 아님) $sql달러로 시작하는 일반변수ex) 'G5_THEME_PATH' = "네가 설정한 테마의 경로"ㄴ 정의값 변수 : constㄴ 한번 정의되면 빼도박도 못함 (그누보드 설치할 때 정의되고 끝!)단, 이

<PHP에서 데이터베이스 접속하기 (db접속하기)> mysql_connect 함수 이용기본적으로 데이터베이스에 접속하는 기본 문장들입니다.처음 4개는 DB에 따라 다르므로 각자에 맞게 설정해주셔야 합니다.(키워드 검색해서) php7.4 mysql8.0 db접속 (

G5_PATH : php가 쓰는 경로 (서버 언어에서만 사용)G5_URL : 도메인서부터 시작하는 경로 (프론트엔드가 사용 = 태그에서 쓴다!)ex) G5_IMG_URL 화면 출력되는 경로를 프론트엔드쪽에서 쓰기 편하게끔 만들어준 변수게시판 구분자(변수) -> $bo_

이렇게 만들어보자상단 웹접근성을 지키기위한 태그순서↓ 한번더여기까지 모양새 (태그 순서만 옮겼을때의 모습)CSS 삽입 후 완성된 형태order로 태그순서 : 로고-네비-검색 (부모에서 flex 주고 순서 바꿔)

write.phpinsert.php체크박스와 같은 배열값 처리하기참고 https://m.blog.naver.com/imm7745/221687698469참고 https://m.blog.naver.com/kimstcool01/220937419440ifra

평가 위해 첨부할 자료DB 테이블 결과 캡쳐sql 화면 캡쳐 CREATE TABLE노션 "\~\~~ 원리로 제작했다. 어떤 부분은 미흡했다"등보고형식이 회의진행의 어려움이 없는가?어떤 게 데이터가 되고,ex) 정보성 메일 수신에 동의합니다 / 인증버튼어떤 게 DB가 되

1. 리액스 스와이퍼 설치 npm i swiper ![](https://velog.velcdn.com/images/la_sta/post/282cee5c-1769-4f98-8437-e9ffed1

첫 화면(+scss 폰트도 삽입)

선생님 깃클론 후 npm i깃 커밋 리셋https://www.lainyzine.com/ko/article/git-reset-and-git-revert-and-git-commit-amend/naviDB 안에 naviDBjson에 접근하라// 나갈 때 찌꺼기 청소

참고 https://goddaehee.tistory.com/305"페이지 이동" 기능을 리액트에서는 리액트 라우터를 통해 처리할 수 있다.a태그와 Link태그 잘 구분해서 쓰기!"App 바깥쪽에 이 기능 쓸게" (하나만 삽입!)주소창에 따라 컴퍼넌트가 선택되어

js의 시간차 공격(data가 늦게 들어옴)을 안정적으로 보완하는 비동기통신promise, restjs API 등Node.js 패키지 생성 및 실행(모듈 설치)https://velog.io/@art-it/Npm-init-%EB%AA%A8%EB%93%88-%EC

강사님 깃https://github.com/4thdraw/nodeBackreactFront.git

sql 저장해둔 xml 접근 모듈 // 나중에 이렇게 쓸 것\*\* 깃허브에 dbconfig(db정보 위험)와 node_modules는 빼고 올리기! ( .gitignore )notice.js 와 연동된 dbconnect.jssql xml파일에서 선택하기

웹디자인 기능사 실기 시험 예제 소스 https://webstudybasic.pe.kr/landing/index.html상대 경로로 쓰기 ./HTML 태그에 style 삽입 말고 필히 외부 연동모든 파일명은 영어로!이미지는 jpg로 제작하기 (사이즈 똑같이)애

< body > 맨 위? 아래? -> 상관없음! < /body > 위에 작성 (relative 때문에 css 꼬이잖아)z-index 있으니까 먼저 읽어들여서 상관없음.d-none 상태에서 addClass('d-block')CSS 추가 // .d-block{d