본문 바로가기

🌌 | WEB DEV115

PoeimaWeb) HTML5_2~3(기본문법, 시멘틱, 검색엔진) 출처https://poiemaweb.com/1. HTML5HyperText Markup Language는 웹페이지를 기술하기 위한 Markup 언어이다.내용, 구조를 담당하는 언어로 HTML 태그를 통해 정보를 구조화할 수 있다.HTML5는 2014년 10월 28일에 확정된 차세대 웹 표준이며 아래의 기능이 추가되었다.기능설명멀티미디어별도의 플러그인 없이 멀티미디어 기능 자체 지원그래픽2차원 그래픽(SVG, 캔버스), 3차원 그래픽(CSS, WebGL) 지원통신서버와의 소켓 통신 지원으로 서버와의 양방향 통신가능디바이스 접근카메라, 동작 센서 등 하드웨어 기능 직접 제어 가능오프라인 및 저장소오프라인에서도 애플리케이션 동작 가능(HTML5가 플랫폼 사용될 수 있음 의미)Semantics 태그요소의 의미를.. 2024. 6. 16.

[React] 16. 컴포넌트 전환효과 부여해주기 이전 글 ▼ 더보기 0. 2023.05.05 - [🌌 | WEB DEV/React] - [React] 0. React를 사용하는 이유 & 초기 세팅 1. 2023.05.07 - [🌌 | WEB DEV/React] - [React] 1. JSX 2. 2023.05.26 - [🌌 | WEB DEV/React] - [React] 2. state (변수, array, object) 2-1. 2023.05.27 - [🌌 | WEB DEV/React] - [React] 2-1. array state 정렬하기 ( .sort()활용) 3. 2023.05.28 - [🌌 | WEB DEV/React] - [React] 3. 컴포넌트 (Component) 4. 2023.05.28 - [🌌 | WEB DEV/React] - .. 2024. 1. 13.

[React] 15. React 메뉴탭 만들기 (클릭 이벤트에 따른 내용 변경) 이전 글 ▼ 더보기 0. 2023.05.05 - [🌌 | WEB DEV/React] - [React] 0. React를 사용하는 이유 & 초기 세팅 1. 2023.05.07 - [🌌 | WEB DEV/React] - [React] 1. JSX 2. 2023.05.26 - [🌌 | WEB DEV/React] - [React] 2. state (변수, array, object) 2-1. 2023.05.27 - [🌌 | WEB DEV/React] - [React] 2-1. array state 정렬하기 ( .sort()활용) 3. 2023.05.28 - [🌌 | WEB DEV/React] - [React] 3. 컴포넌트 (Component) 4. 2023.05.28 - [🌌 | WEB DEV/React] - .. 2024. 1. 13.

[React] 14. React와 서버 연동하기 (ajax를 이용해! (get, post) ) 이전 글 ▼ 더보기 0. 2023.05.05 - [🌌 | WEB DEV/React] - [React] 0. React를 사용하는 이유 & 초기 세팅 1. 2023.05.07 - [🌌 | WEB DEV/React] - [React] 1. JSX 2. 2023.05.26 - [🌌 | WEB DEV/React] - [React] 2. state (변수, array, object) 2-1. 2023.05.27 - [🌌 | WEB DEV/React] - [React] 2-1. array state 정렬하기 ( .sort()활용) 3. 2023.05.28 - [🌌 | WEB DEV/React] - [React] 3. 컴포넌트 (Component) 4. 2023.05.28 - [🌌 | WEB DEV/React] - .. 2024. 1. 12.

[React/JS] setTimeout, setInterval 은 전혀 "시계" 하지 않아 (setTimeout, setInterval 오류) 프로젝트에 삽입할 스톱워치 만들어 놓았다. 6초를 세어보는데 이상하게 체감 상 8초는 되는 것 같았다. 아 이거 이상한데?? 1. setInetval을 활용한 타이머 1) 작성 코드 내가 작성한 코드는 setInterval을 이용하여 주기적으로 시간state를 증가시키는 방식이다. const [run, setRun] = useState(); //스톱워치start상태 const [time, setTime] = useState(0); //시간state const intervalRef = useRef(); //시작상태 감지 useEffect(()=>{ if(props.start){ setRun(true); } else{ clearInterval(intervalRef.current) setRun(false); .. 2024. 1. 6.

[React] 13. 리액트 컴포넌트의 Lifecycle와 useEffect 이전 글 ▼ 더보기 0. 2023.05.05 - [🌌 | WEB DEV/React] - [React] 0. React를 사용하는 이유 & 초기 세팅 1. 2023.05.07 - [🌌 | WEB DEV/React] - [React] 1. JSX 2. 2023.05.26 - [🌌 | WEB DEV/React] - [React] 2. state (변수, array, object) 2-1. 2023.05.27 - [🌌 | WEB DEV/React] - [React] 2-1. array state 정렬하기 ( .sort()활용) 3. 2023.05.28 - [🌌 | WEB DEV/React] - [React] 3. 컴포넌트 (Component) 4. 2023.05.28 - [🌌 | WEB DEV/React] - .. 2024. 1. 2.

[React] 13. 리액트 컴포넌트의 Lifecycle과 useEffect 이전 글 ▼ 더보기 0. 2023.05.05 - [🌌 | WEB DEV/React] - [React] 0. React를 사용하는 이유 & 초기 세팅 1. 2023.05.07 - [🌌 | WEB DEV/React] - [React] 1. JSX 2. 2023.05.26 - [🌌 | WEB DEV/React] - [React] 2. state (변수, array, object) 2-1. 2023.05.27 - [🌌 | WEB DEV/React] - [React] 2-1. array state 정렬하기 ( .sort()활용) 3. 2023.05.28 - [🌌 | WEB DEV/React] - [React] 3. 컴포넌트 (Component) 4. 2023.05.28 - [🌌 | WEB DEV/React] - .. 2024. 1. 2.

[NodeJS+Express] 13. form태그에서 PUT, DELETE 요청하기 & MongoDB 수정문법 + form 태그를 그대로 사용하면 GET, POST 요청만 가능하다. 하지만 PUT, DELETE 등을 활용하면 더 좋은 API의 기준에 부합할 수 있을 것이다. 이를 가능하게 하는 방법에 대해서 알아보자! 1. method-override method-override 라는 라이브러리를 이용하면 가능하다. 설치 npm install method-override import //server.js const methodOverride = require('method-override') app.use(methodOverride('_method')) 서버파일 최상단에 위 코드를 작성해서 라이브러리로부터 필요한 것들을 가져온다. 1) form 태그 수정 //edit.ejs ... ?_method=PUT 을 act.. 2023. 10. 15.

[NodeJS+Express] 12. 글 수정기능 만들기 이번에는 글을 수정하는 기능을 구현해보자. 0. 들어가기전 글을 수정하는 과정을 요약해보면 아래와 같다. 1) 글 마다 존재하는 수정버튼 클릭 2) 수정페이지에서 글 수정 (수정 대상 페이지의 내용이 기입되어있음) 3) 수정완료 버튼 누르면 DB에 데이터 전송 후 수정 완료 이러한 과정을 거쳐 구현을 해보자! 1. 수정 기능 만들기 1) 수정 페이지 (1) 서버파일 세팅 수정 페이지에 들어가게 되면 수정 대상인 데이터가 기입되어있다. //server.js app.get('/edit/:num', async(request, response) => { try { let result = await db.collection('post').findOne({_id : new ObjectId(request.params.. 2023. 10. 15.

이전 1 2 3 4 ··· 13 다음

티스토리툴바