개발/FRONT21 VUE HTTP 통신 웹 앱의 HTTP 통신 방법 요즈음 웹 앱에서 서버에 데이터를 요청하는 HTTP(HyperText Transfer Protocol) 통신은 필수로 구현해야 하는 기능입니다. 과거의 웹 사이트가 정적인 텍스트나 간단한 이미지를 나타내는 데 그쳤다면 이제는 사용자와의 상호 작용에 따라 데이터를 동적으로 화면에 표시해 줘야 하기 때문입니다. 여기서 HTTP는 브라우저와 서버 간에 데이터를 주고받는 통신 프로토콜(protocol)입니다. 브라우저에서 특정 데이터를 보내달라고 요청(request)을 보내면 서버에서 응답(response)으로 해당 데이터를 보내주는 방식으로 동작합니다. 서버에 ‘해당 데이터를 보내주세요.’라는 메시지를 보내는 게 바로 ‘HTTP 요청을 보낸다’와 같은 의미입니다. 웹 앱 HTTP .. 2024. 1. 20. vue 라이프 사이클에 대하여 beforeCreate 인스턴스가 생성되고 나서 가장 처음으로 실행되는 라이프 사이클 단계입니다. 이 단계에서는 data 속성과 methods 속성이 아직 인스턴스에 정의되어 있지 않고, 돔과 같은 화면 요소에도 접근할 수 없습니다. created beforeCreate 라이프 사이클 단계 다음에 실행되는 단계입니다. data 속성과 methods 속성이 정의되었기 때문에 this.data 또는 this.fetchData()와 같은 로직들을 이용하여 data 속성과 methods 속성에 정의된 값에 접근하여 로직을 실행할 수 있습니다. 다만, 아직 인스턴스가 화면 요소에 부착되기 전이기 때문에 template 속성에 정의된 돔 요소로 접근할 수 없습니다. 그리고 data 속성과 methods 속성에 접근.. 2024. 1. 14. NPM이란? 1. npm 알아보기 npm은 Node Package Manager의 약어로, 이름 그대로 노드 패키지 매니저입니다. 대부분의 자바스크립트 프로그램은 패키지라는 이름으로 npm에 등록되어 있으므로 특정 기능을 하는 패 키지가 필요하다면 npm에서 찾아 설치하면 됩니다. npm에는 60만 개(2018년 5월 기준)에 달하는 패키지가 등록되어 있습니다. 이는 세계 최대 규모입니다. 방대한 양의 패키지들은 노드와 자바스크립트의 생태계를 더욱 견고하게 만들고 있습니다. 게다가 대부분 오픈 소스여서 노드를 사용해 웹을 개발할 때 많은 도움이 됩니다. npm에 업로드된 노드 모듈을 패키지라고 부릅니다. 모듈이 다른 모듈을 사용할 수 있는 것처럼, 패키지가 다른 패키지를 사용할 수도 있습니다. 이런 관계를 의존 관계.. 2024. 1. 13. jquery json을 form으로, form을 json으로 // 테스트 html 코드 이름: 이메일: 나이: JSON으로 변환 1. json -> form form 데이터를 forEach 문으로 돌려서 json에 넣어 주었다. 결과는 아래와 같이 나온다. { "name": "John", "email": "john@example.com", "age": "25" } 2. json -> form // 가상의 JSON 데이터 예시 var jsonData = { name: "John Doe", email: "john@example.com", age: 25 }; // JSON 데이터를 폼에 설정 $.each(jsonData, function(key, value) { $('form#detail [name=' + key + ']').val(value); }); 마찬가지로 js.. 2024. 1. 13. 이전 1 2 3 4 5 6 다음