💡script 태그 defer, asyncscript와 html아래 예시와 함께 script 파일을 효과적으로 불러오는 방법에 대해 알아보겠습니다.첫번째 예시head 태그 안에 삽입 버튼 ➡️ html 파싱은 순차적으로 진행되기 때문에 DOM이 생성되기 전에 script가 실행되어 #btn을 불러올 수 없어 null이 발생합니다.두번째 예시body 태그의 마지막에 삽입 버튼 let btn = document.querySelector('#btn');console.log('btn : ', btn); // 버튼세번째 예시window.onload 함수HTML파싱, DOM생성 그리고 외부 콘텐츠(images, script, css, etc)가 로드된 후 발생하는 이벤트 ..

JavaScript 탄생배경웹문서를 제어하기 위해 만들어짐.즉, html 문서를 제어 및 조작하기 위해 만들어진 언어html 문서를 javaScript로 제어할 수 있는 이유는 브라우저 안에 웹 문서를 해석할 수 있는 렌더링 엔진이 있기 때문!크롬 : 블링크렌더링시 한 줄 한 줄 해석 후 문서를 객체화 하여 javaScript로 접근할 수 있도록 함.이처럼 문서를 객체화 했다고 해서 문서 객체 모델(Document Object Model)은 웹문서를 script로 제어할 수 있도록 한 모델이다~DOM이란?Document Object Model로 문서 객체 모델Tree구조로 되어있음각각의 요소를 node라고 함.script는 node에 접근하여 제어할 수 있게 됨접근한다 → 제어한다. 끝!document객..

안녕하세요. 개인적인 시간이 조금 생겨서 본업하면서 혼자 미니 프로젝트를 시작해보려고 합니다.개발자라면 응당..개인 프젝 하나쯤은 있어야 한다는게 제 생각인데..실천까지 너무 오래 걸렸네요^^; 주제를 뭐로 할까 고민을 많이 했는데요.영화/드라마 평점 기록하는 애플리케이션으로 하기로 결정했습니다!ex. 왓챠피디아 너무 뻔하다구요?맞습니다.하지만 Vue3, TypeScript 공부가 목적인지라 간단하면서 제가 관심있는걸 해보고 싶었습니다.ㅎㅎ 이번 글은 간단히 기획/개요만 작성해놓고내일부터 설계 및 ui 레이아웃 설정할 것 같습니다. 간만에 혼자 하려니까 생각이 안나고 막막한데 혼자 A to Z 할 생각에 조금은 설레기도 합니다.부디 이 프로젝트가 무사히 끝나길 바라며..시작해보겠습니다.프로젝트 개요이름:..

타입스크립트에서 변수에 값을 할당하고 타입을 부여하는 방법은 2가지 입니다.interface Item { name: string;}const book:Item = { name: "Titanic" }; // 선언 방식const pencil = { name: "Monami" } as Item; // 단언 방식 얼핏 두가지 방식은 같아 보이지만 타입체커에서 차이점이 드러납니다.const book:Item = {}; // 'Item' 유형에 필요한 'book' 속성이 '{}' 유형에 없습니다.const pencil = {} as Item; // 오류X 이 차이점은 아래와 같습니다. 타입 선언은 할당되는 값이 해당 인터페이스를 만족하는지 검사합니다.타입 단언은 강제로 타입을 지정했으니 타입 체커에게 오류를 무시..

타입스크립트 타입 정의를 보다보면 종종 ?과 !를 볼 수 있습니다.주로 자바스크립트를 써서 개발하던 저에게는 조금은 생소한 표현식이라 구체적으로 무엇인지 찾아보았습니다. 개념!와 ?는 변수가 값의 존재 여부와 관련된 키워드로, 코드에서 안정성과 가독성을 높이기 위해 사용됩니다.!값이 null이나 undefined가 아님을 확신할 때 사용합니다.타입스크립트는 변수에 null이나 undefined가 들어갈 가능성이 있으면 경고를 주지만, !를 붙이면 "이 값은 절대 null이나 undefined가 아니야! 라고 컴파일러에게 전달(?)하는 역할을 합니다.let value: string | undefined;value!; // 이 시점에 undefined가 아님을 보장하지만 실제로 undefined일 경우 런타..

제목처럼 약 7개월의 국비 수료를 끝마친 후 한 달간 취준하여 취업에 성공하였습니다. 그 간 있었던 일 풀어볼겸 초심 잃지 않을겸 졸린 눈 꾹 참으며 한번 써보겠습니다. 서류는 사람인, 잡코리아, 원티드 등 안가리고 신입 글자 붙은 곳은 다 지원했던 것 같습니다. 제 원래 목표는 서비스기업이었으나.. 대부분 서류 탈락하는 쓴 맛을 봤습니다.. ^^후후.. (이와중에 유니콘 기업들은 안 될거 알아서 지원할 생각도 못함) 아 스크롤 더 길어요. 다 캡쳐하기 귀찮아서 그냥 위에만ㅎㅎ 근데 다시 생각해보면 당연한 결과였음. 전공자? 아님. 정보처리기사? 없음. 경력? 있을리가. 코테? 자신 있는 상태는 아니었음. 그나마 비빌 수 있는건 열심히 한 포트폴리오뿐..하지만 세상은 호락호락하지 X 하여 제가 가고싶었던..

안녕하세요. 사실 파이널 프로젝트는 7월 25일에 발표를 끝으로 성공적으로 끝마쳤는데 말이죠.. 저는 왜 이제야 후기 글을 쓰는 걸까요..^^.. 꾸준히 기록하고, 발전하시는 블로거 분들 정말 정말 존경합니다. 파이널 프로젝트 하면서 백엔드가 정말 어려워서 초반 몇 일 팀원 분들이랑 같이 헤매면서 했었는데, 지금 생각해보면 그렇게 고생을 했었기에 가장 기억에 오래 남는 것 같기도 하네요. ㅎㅎ 그럼 후기 드루갑니당! 오늘의 데이트는 하이브리드 웹앱 애플리케이션으로 사용자가 직접 데이트 코스를 공유하는 애플리케이션 입니다. 스크린샷 기타 등등.. 너무 많아서 여기까지만 올립니당 ㅜㅜ... 배포주소 Web URL : https://todaysdate.site:8080 App URL : https://play..

문제 알파벳 소문자와 대문자로만 이루어진 길이가 N인 단어가 주어진다. 한 줄에 10글자씩 끊어서 출력하는 프로그램을 작성하시오. 입력 첫째 줄에 단어가 주어진다. 단어는 알파벳 소문자와 대문자로만 이루어져 있으며, 길이는 100을 넘지 않는다. 길이가 0인 단어는 주어지지 않는다. 출력 입력으로 주어진 단어를 열 개씩 끊어서 한 줄에 하나씩 출력한다. 단어의 길이가 10의 배수가 아닌 경우에는 마지막 줄에는 10개 미만의 글자만 출력할 수도 있다. import java.util.ArrayList; import java.util.List; import java.util.Scanner; public class Main { public static void main(String[] args) { Scanne..

문제 알파벳 소문자로만 이루어진 단어가 주어진다. 이때, 이 단어가 팰린드롬인지 아닌지 확인하는 프로그램을 작성하시오. 팰린드롬이란 앞으로 읽을 때와 거꾸로 읽을 때 똑같은 단어를 말한다. level, noon은 팰린드롬이고, baekjoon, online, judge는 팰린드롬이 아니다. 입력 첫째 줄에 단어가 주어진다. 단어의 길이는 1보다 크거나 같고, 100보다 작거나 같으며, 알파벳 소문자로만 이루어져 있다. 출력 첫째 줄에 팰린드롬이면 1, 아니면 0을 출력한다. package 백준10988번문제; import java.util.Scanner; public class Main { public static void main(String[] args) { Scanner sc = new Scanne..

REST API 먼저 REST란 'Representational State Transfer'의 약자로, 월드 와이드 웹(WWW)과 같은 분산 하이퍼미디어 시스템 아키텍처의 한 형식 입니다. 주고받는 자원(Resource)에 이름을 규정하고 URI에 명시해 HTTP메소드(GET, POST, PUT, DELETE)를 통해 해당 자원의 상태를 주고받는 것을 의미 합니다. REST API는 REST아키텍처를 따르는 시스템/애플리케이션 인터페이스라고 볼 수 있습니다. REST 아키텍처를 구현하는 웹 서비스를 'RESTful하다'라고 표현합니다. REST의 특징 유니폼 인터페이스 유니폼 인터페이스는 일관된 인터페이스를 의미 합니다. 즉, REST 서버는 HTTP 표준 전송 규약을 따르기 때문에 어떤 프로그래밍 언..