본문 바로가기

분류 전체보기322

비동기와 동기 함수 비동기와 동기함수는 프로그래밍에서 중요한 개념이다. 동기 함수👉 동기함수는 코드가 위에서 아래로 순차적으로 실행되며, 한 번에 하나의 작업을 처리한다. 즉 한 작업이 완료되기 전까지 다음 작업으로 넘어가지 않는다. 이는 우리가 보통 생각하는 일반적인 실행 방식이다. 예를 들어, 동기 함수로 파일을 읽는 작업을 수행한다면, 파일을 읽는 동안은 다른 작업을 할 수 없고, 파일을 읽은 후에야 다음 작업을 수핼할 수 있다. 비동기 함수👉 작업을 백그라운드에서 실행하고, 작업이 완료되지 않아도 다음 코드로 넘어갈 수 있다. 비동기 함수는 작업을 시작한 후에 다른 작업을 계속할 수 있으며, 작업이 완료되면 그 결과를 받아올 수 있다. 이를 통해 다른 작업을 동시에 처리하거나, 작업이 완료될 때 까지 대기하지 않고 .. 2023. 5. 30.
JAVA JSP Java에서 JSP는 Java를 기반으로 하는 서버 측 웹 프로그래밍 기술이다. JSP를 사용하면 동적인 웹페이지를 생성하고 웹 애플리케이션을 개발할 수 있다. JSP는 HTML 코드에 Java코드를 삽입하여 작성된다. 서버에서는 JSP파일을 해석하여 Java서블릿(Servlet)으로 변환하고, 이를 실행하여 동적인 HTML페이지를 생성한다. 이때 JSP파일은 웹 서버에서 동작하는 Java코드로 변환되어 실행되는 것이며, 그 결과로 클라이언트에게 HTML페이지가 전달된다. JSP의 특징🙌 스크립트 요소 JSP파일 내에서 Java코드를 삽입하기 위해 스크립트 요소를 사용할 수있다. 가장 일반적인 스크립트 요소는 태그이다. 이 태그 안에 Java코드를 작성할수 있으며, 이 코드는 서버에서 실행된다. 표현식 .. 2023. 5. 30.
JAVASCRIPT PreventDefault() preventDefault()는 JavaScript에서 이벤트의 기본 동작을 취소하는 메소드이다. 이 메소드를 호출하면 이벤트의 기본 동작이 실행되지 않고, 대신에 사용자가 지정한 동작이 실행된다. HTML요소들은 기본적으로 여러 가지 이벤트를 가지고 있는데 예를들어, 태그의 경우 클릭 이벤트가 발생하면 해당 링크로 이동하는 기본 동작이 발생하는데 이때, preventDefault()를 사용하면 링크로의 이동이 취소 된다. preventDefault()메소드는 주로 이벤트 핸들러 함수 내에서 사용된다. 이벤트 핸들러함수는 이벤트가 발생했을 때 실행되는 함수이다. 이벤트 핸들러 함수내에서 preventDefault()를 호출하면 이벤트의 기본 동작이 막히게 된다. 아래 예시를 보자면👉 링크 위의 예시에서는.. 2023. 5. 30.
JAVASCRIPT Fetch() fetch 함수는 주로 웹 개발에서 사용되는 함수로, 네트워크를 통해 데이터를 가져오는 역할을 한다. 주로 HTTP 요청을 보내고 응답을 받아오는 데 사용된다. fetch함수는 브라우저의 내장 API로 제공되는데, 이 API를 사용하여 비동기적으로 데이터를 가져올 수 있다. fetch함수는 기본적으로 Promise를 반환한다. Promise는 비동기 작업이 완료되었을 때 결과를 처리학 위해서 사용되는 객체이다. fetch함수가 Promise를 반환하므로 우리는 then()메소드를 사용하여 데이터를 처리하거나, async/await 구문과 함게 사용할 수 있다. 간단한 예로 fetch 함수를 사용하자면 JSON데이터를 가져오는 기본적인 fetch요청인데 fetch("https://api.example.co.. 2023. 5. 30.
20230530 수업내용😢😢😢 비쥬얼스튜디오에서 다른 class를 하나더 만들었다. form 디자인 아이디 가입 form 디자인 아이디 비밀번호 가입 form 디자인 아이디 비밀번호 가입 반응형 ui에대해서 배우고있다. col-sm-6 같은 경우 폭을 좁게했을 때 창에대해서 100%를 유지하고있다. mx-auto라는 것은 마진의 x축을 auto로 잡아주겠다 라는 뜻이다. 부트스트랩 form에서 Validation이라는 것은 예를 들어 회원가입할때 필수로 입력해야할 것이 제대로 입력이 안되었을 때 오류를 경고해주는 것이다. 그런 디자인을 부트스트랩에서 css를 제공해주고있다. 밑에 이메일 형식에 맞게 입력해 주세요 가 보이려면 is-invalid가 class에 추가 되어야 한다. 회원가입폼 아이디 5 글자 이상 입력하세요! Looks .. 2023. 5. 30.
글자를 입력했을 때 조건에 따라 반응하게 만들어보기 회원가입폼 아이디 5 글자 이상 입력하세요! Looks good! "input"은 event명 e 는 event 객체 활용 e.taget 은 event가 일어난 바로 그 요소의 참조값 inputId.length >= 5; 는 문자열의 길이 알아내기 e.target.classList.add("is-valid"); e.target.classList.remove("is-invalid"); 는 class 속성 추가, 제거 2023. 5. 30.
POST API를 개발하고 테스트하기 전에는 쿼리를 이용해서 데이터를 받았엇는데 POST API 같은 경우에는 쿼리를 사용하는게 아니라 HTTP Body를 이용한다. 이 Body에 데이터를 넘기게 되면 API에서는 Body에 있는 데이터를 열어서 정보를 가져오게 되는데 이 때 사용되는 문법이 있다. 그것은 JavaScriptObjectNotation, JSON이다. JSON 이란 객체 표기법으로 무언가를 표현하기 위한 형식이다. 한 사람이 있다는 가정하에 설명해보자면 사람 { "name" : "누구누구", 👉 ,쉼표로 다음 데이터를 넣을수 있게끔해주고 누구누구라는 문자열을 감싸기 위해 " "를 사용해주어야한다. "age" : 50, 👉숫자는 " "는 사용을 안한다. "friend" : ["친구1", "친구2"] 👉JSON의 value 에는 .. 2023. 5. 28.
GET API 개발하고 테스트 API란 데이터를 컴퓨터 끼리 주고받는 과정에서 어떻게 주고 받을지 정해놓은 것을 API라고 한다. 처음 테스트로 덧셈을 할 수 있는 API를 만들어 보겠다. 가장먼저 패키지를 만들어주겠다. 이런 식으로 하나의 패키지를 만들어 주었다(맥 단축키를 써보았다. ⌘ + N) 계산식을 만들기 위해 calculator 라고 만들어주고 그안에 CalculatorController라는 클래스까지 만들어보겠다. 이렇게 우리가 어떻게 API를 어떻게 만들지를 API Specification(명세)라고 한다. 즉 API명세를 정하고 그 명세대로 API를 개발하는 것이다. API는 약속이기 때문에 메소드는 어떻게 하고 Path는 어떻게하고를 먼저 정하고 프로젝트에 들어가야 한다. 덧셈 API에 다음 4가지를 정해보겠다. H.. 2023. 5. 28.
네트워크란 무엇인가? 네트워크란? 이 서버라는 컴퓨터에게 요청하기 위해서는 인터넷 네트워크를 통해서 요청을 해야하는데 아이피라는 각 고유한 번호끼리 공유한다는 느낌인데 예를 들어 244.**.**.*이런 주소는 알아보기 어렵다 그래서 네이버나 다음처럼 알기 쉬운 이름으로 바꿔주는데 이것을 도메인이라 한다. 이러한 체계를 Domain Name System(DNS)라고 부른다. 실제 개발하고 배포할 때 쓰이며 나중에 설정해볼 것 이다. 여기서 등장하는 Http와 API 인터넷에서 데이터를 주고 받는 표준이 있는데 이를 HTTP(HyperTextTransferProtocol)라한다. 여기서 Protocol 은 표준,약속을 의미하는데 이를 사용하는 데에는 지켜야할 규칙이 있다. HTTP요청 GET/portion?color = red.. 2023. 5. 28.