본문 바로가기

공부34

3-1. conditional 조건문 조건 만족 여부(true/false)에 따라 코드 수행 여부가 결정됨 if문 조건식을 만족하면 실행 코드 실행 if(조건식){ 실행코드; } if ~ else 문 조건식을 만족하면 if문 실행, 만족하지 않으면 else문 실행 조건식의 결과에 따라 두 가지 결과 중 하나를 실행시킬 때 사용 if ~ else if 문 여러 if문 조건식 중 만족하는 것을 찾아 실행, 만족하는게 없으면 else문 실행 조건식의 결과에 따라 여러가지 결과 중 하나를 실행시킬 때 사용 선택문 일치하는 경우의 값이 있을 경우 선택하여 실행 코드를 수행 일치하는 값이 없을 경우 default문(optional) 수행 switch문 const 변수 = 값; switch (변수) { case 값1: 코드1 break; case.. 2023. 9. 21.
2. operator 연산 : 데이터를 처리하여 결과가 나오는 것 예) 연산식 : 10 + 20 연산자 : + 피연산자 : 10, 20 산술 연산자 +, - , * , / , %(나머지 연산자) 문자 결합 연산자 + 여러 개의 문자를 하나의 문자로 결합할 때 사용 문자 데이터가 하나라도 포함되어 있으면 문자 결합 연산 연산의 기본 방향 : 왼쪽에서 오른쪽으로 대입 연산자 = 값(데이터)을 변수에 저장할 때 사용 복합 대입 연산자 +=, -=, *=, /=, %= 대입 연산자 응용 : 데이터를 동적으로 받아와서 넣어줄 때 사용 innerHTML, appendChild(), insertBefore() 증감 연산자 ++(1씩 증가), --(1씩 감소) 📍다른 연산자와 같이 사용 시 위치(전위, 후위)에 따라 연산이 달라짐 비교 연.. 2023. 9. 21.
[CSS]화면고정 position: sticky; top: 0; 스크롤로 인해서 화면에서 벗어날 상황에서 최상단에 고정된다. 부모 태그가 있고 부모 태그가 더 크다면 부모 태그가 화면에서 벗어날 때 같이 사라지게 된다. 2023. 9. 5.
17. 환경변수 그동안 작업한 application은 주소가 localhost로 하드코딩되어있다. 그런데 개발할 때 사용할 api와 서버의 deploy에서 실서버에서 사용할 api 주소가 다를 수도 있다. 이런 정보를 application의 소스코드에서 떨어뜨려서 별도로 관리해야 할 필요성이 있다. 그때 환경변수를 보면 된다. .env .local 파일을 홈 디렉토리에 생성하고 파일에 application에 사용할 정보들을 작성하면 된다. 이 데이터를 가지고 오는 방법 📍 ./ layout.js ↓ (변경) 📍 create/ page.js ↓ (변경) 🚧 글 생성 시 undefined 에러 발생 기본적으로 환경변수에는 기밀이 포함될 데이터가 포함될 가능성이 높다. 이런 기밀 정보까지 클라이언트 컴포넌트에 노출된다면 이 .. 2023. 8. 26.
16. 글 삭제 📍 삭제 기능 구현 Control.js 파일에서 delete 버튼을 클릭했을때 delete 기능이 동작해야하므로 onClick 추가 삭제를 하기 위해서는 서버쪽으로 메소드를 delete로 전달해야하기 때문에 option으로 DELETE 메소드 추가하면 해당 글이 삭제된다. 그러면 사용자가 열어볼 데이터가 삭제되었기 때문에 root로 redirection 해야한다. 그러기 위해서는 router가 필요하다. 삭제 작업이 끝났다면 root로 이동을 하고 그다음에 서버 컴포넌트들을 refresh하면 글이 삭제된다. 2023. 8. 26.
15. 글 수정 http://localhost:9999/update/3 구현하기 🔔 먼저 app 폴더 밑에 update 폴더 생성, 그 밑에 [id] 폴더 생성, 그 밑에 page.js 생성 update 기능에는 create 기능과 read 기능이 필요하다. 💡 기본적인 UI는 create를 가져오는 게 더 편하기 때문에 create 기능 가져오면 된다. create/page.js 내용 그대로 복사 붙여넣기 후 컴포넌트 함수명을 Create에서 Update로 변경해준다. 💡 update에서는 title, body input 값에 원본이 적혀있어야 하기 때문에 read 기능 가져오면 된다. read/page.js 열어보면 read page는 현재 서버 컴포넌트이기 때문에 그대로 사용할 수 없다. 왜냐하면 update는 클.. 2023. 8. 26.
728x90