개발자 연쨘

리액트에서는 html이 아니라 JSX라는 문법을 사용합니다! 리액트에서는 하나 만들기 위해서는 자바스크립트로 React.createElement('div', null) 이렇게 사용해야하는데 그러면 복잡하고 어려우므로 JSX를 사용하는겁니다!! 오늘은 이 JSX문법을 실제로 어떻게 적용하는지 알아보았습니다. 🐰 class 넣을땐 className 🐰 스타일을 주기 위한 class명을 넣을땐 className을 사용합니다. class를 쓰면 안되는 이유는 자바스크립트에서 사용하는 예약어인 class라는 키워드를 사용하면 안되기 때문입니다. function App() { return ( 블로그 ); } export default App; 🐰 변수를 html에 넣을땐 {} 중괄호 사용 🐰 function App..

변수란? 🐰 변수는 값의 위치(주소)를 기억하는 저장소이다. 값의 위치란 값이 위치하고 있는 메모리 상의 주소를 의미한다. 즉, 변수란 값이 위치하고 있는 메모리 주소에 접근하기 위해 사람이 이해할 수 있는 언어로 명명한 식별자이다. 식별자는 어떤 대상을 유일하게 식별할 수 있는 이름. 식별자에는 변수명, 함수명, 프로퍼티명, 클래스명등이 있음. 변수랑 식별자는 같은게 아닌가?! 🐯 변수와 식별자는 프로그래밍에서 중요한 개념이지만 서로 다른 의미를 가지고 있음. -변수 (Variable): 변수는 데이터를 저장하고 나중에 사용하기 위한 메모리 위치를 가리키는 이름 예를 들어, 숫자나 문자열과 같은 데이터를 저장할 때 사용 프로그램에서 변수는 값을 보관하고 해당 값을 변경할 수 있습니다. 컴퓨터 용어로서의..

문제 설명 주어진 초기 코드는 변수에 데이터를 저장하고 출력하는 코드입니다. 아래와 같이 출력되도록 빈칸을 채워 코드를 완성해 주세요. 출력 예시 Spring is beginning 13 310 쉬운문제여서 간단하게 성공! ㅎㅎ...

- RAM(주기억장치 ) RAM에는 현재 사용중인 프로그램이나 데이터가 저장되어 있다. 전원이 꺼지면 기억된 내용이 모두 사라지는 휘발성 메모리이다. - HDD, 드라이브, SSD(HDD보다 더 우수함) 보조기억장치는 주기억장치의 단점을 보완하기 위한 기억장치. 주기억장치에 비해속도는 느리지만 전원이 꺼져도 내용이 그대로 유지되고, 저장용량이 크다는 장점이 있다. - 저장된 정보로 결과를 만들어 내는 작업 → CPU(Central Processing Unit) CPU는 연산과 제어를함 - CPU와 GPU는 연산을 통해 결론을 도출하는 기능을 수행하는 처리장치 - GPU는 그래픽 연산을 빠르게 하여 결과값을 모니터에 출력하는 작업에 특화 -하드웨어와 소프트웨어는 처리하는 과정을 할 수 있게 해주는 컴퓨터 ..

function에 사용가능한 피라미터 문법 함수내에 구멍을 뚫어준다고 생각해보자! function alertOpen(구멍){ document.getElementById('alert').style.display = 구멍; } 지금 함수 내에 구멍을 뚫었습니다. 구멍을 뚫는 법은(파리미터 생성법) () 소괄호 내에 아무 글자나 적고 {} 중괄호 내에도 같은 글자 아무데나 적으면 됌. 구멍을 뚫는이유(파라미터 생성하는 이유) → 구멍을 뚫으면 함수를 업그레이드해서 사용할 수 있기때문! 구멍이 뚫려있으면 이제 함수를 쓸 때 그냥 쓰는게 아니라 소괄호 내에 뭔가 문자나 숫자등을 입력해서 사용가능 function alertOpen(구멍){ document.getElementById('alert').style.dis..

자바스크립트 function 문법 function (일명 함수) 라는 문법이 있는데 이 문법 쓰는 이유부터 알아보자! 함수는 긴코드를 한 단어로 축약하고 싶을 때 쓰는 문법! 개발자의 말로 표현하자면 특정 기능을 다음에도 쓰기 위해 모듈화해놓는 문법 간단하게 말하면 긴 코드 짧은 단어로 축약하고 싶을 때 쓰는 문법이라고 암기 function 작명(){ 축약하고 싶은 코드 } function 키워드 쓰고 소괄호, 중괄호 소괄호 왼쪽에 작명 긴 코드를 중괄호 안에 담으면 코드 축약 끝 그럼 이제 작명() 이거 쓸 때 마다 그 자리에 긴 코드가 실행 Alert 여는 코드 function으로 축약해보기 버튼의 onclick 안에 길고 더러운 자바스크립트 코드가 있었는데 그걸 함수 문법을 이용하면 짧게 축약해서 ..

css에서 UI를 숨기고싶으면 display:none; 주면 되고, 다시 보여주고 싶으면 display:block; 넣으면 보임 이게 싫으면 visibility:hidden; 거의 모든 html태그 내에 onclick이라는 속성을 넣을 수 있는데 이걸 넣게되면 해당 html을 클릭시 onclick안의 자바스크립트를 실행 버튼 예시로 Alert UI 디자인해서 안보이게 만들어보자! step 1. Alert UI 디자인부터 하기 html파일부터 들여다보면 알림창 css에서는 이것을 먼저 가려야하고 자바스크립트로 버튼누르면 보이게 할것임 그러기 위해서는 css로 먼저 저창을 가려놓아야함 .alert-box { background-color: pink; padding: 10px; color: white; bor..

자바스크립트의 기본 단어들을 해석해보자 ! 반갑습니다 부분에 단어들을 해석해보면 document → 문서를 의미함. 여기서는 html 웹문서 의미 마침표 (.) → ~의 getElementById('hi') → 아이디가 ‘hi’인 html 요소 일면(element) 를 찾아라 innerHTML → 내부 HTML이라는 뜻 = → 등호는 프로그래밍에서 오른쪽에 있는걸 왼쪽에 대입하라는 뜻 ‘안녕’ →안녕이라는 문자(큰따옴표, 작은따옴표안에 담겨있으면 항상 문) html 바꾸는법 document.getElementById('???').??? = '???'; 여기 물음표만 맘대로 바꿔주면 html의 모든걸 변경하고 조작가능 src 바꾸는법 document.getElementById('???').src = 'pr..

오늘 TIL 3줄 요약 인터넷 익스플로러는 시장점유율만 믿고 게을러서 없어졌다. 풀스택개발자는 프론트앤드, 백엔드, 데브옵스까지 해야한다. 서버리스는 서버가 없는게 아니다. TIL (Today I Learned) 날짜 2023. 10. 11 오늘 읽은 범위 에피소드16 인터넷 익스플로러가 사라진 이유와 브라우저 엔진 에피소드17 아, 쿠키가 먹는 게 아니라고요? 에피소드18 프런트엔드, 백엔드? 에피소드19 서버가 뭔지 아직도 모른다고? 에피소드20 슈퍼 개발자만 할 수 있다, 풀스택? 에피소드21 서버리스는 서버가 없다는 뜻? 책에서 기억하고 싶은 내용을 써보세요. 인터넷 익스플로러가 사라진 이유와 브라우저 엔진 ● 최신 기술을 가장 빨리 지원했던 인터넷 익스플로러 1996년에 인터넷 익스플로러 3.0..

오늘 TIL 3줄 요약 라이브러리와 프레임워크는 우리를 더 편리하게해주는 도구이다. 도메인은 돈주고 사야하고 이것을 관리하는건 레지스트리다. 플래시의 종료는 스티브잡스의 결정에 영향을 받았다. TIL (Today I Learned) 날짜 2023. 10. 11 오늘 읽은 범위 에피소드11 라이브러리와 프레임워크, 비슷한 거 아냐? 에피소드12 제이쿼리느느 반드시 배워야 하는 기술일까? 에피소드13 그놈의 API, 대체 뭐길래? 에피소드14 도메인은 왜 돈을 주고 사야 할까? 에피소드15 플래시의 서비스 종료와 스티브 잡스 책에서 기억하고 싶은 내용을 써보세요. 라이브러리와 프레임워크 공통점 개발 속도를 더 빠르게 만들어 준다 누군가 미리 작성해 놓은 코드이고, 우리의 개발 속도를 더 빠르게 만들어주는 도..