전체 글 562

W3C : 웹 표준화 기준 제공

https://www.w3.org/ W3CThe World Wide Web Consortium (W3C) develops standards and guidelines to help everyone build a web based on the principles of accessibility, internationalization, privacy and security.www.w3.org프론트엔드 언어는 기능이 정말 정말 많기 때문에 이를 표준화하는 곳이 있는데그곳이 바로 W3C입니다.표준화라고 한다면 다양한 기종의 기기와 브라우저에서 모두 잘 작동하는 등의 표현방식의 기준을 삼는 것입니다.

[JS]함수의 종류(익명/화살표/클로저/콜백)

명시적 함수(=보통 함수)function 함수명() { } 익명함수let 변수명 = 함수; 2023.06.11 - [✨ UI/💛 JavaScript] - [JS]스케줄링 함수 setTimeout() 과 setInterval() 화살표 함수let 변수명 = ( ) => 반환; 2024.12.11 - [💬 프로그래밍 표현식] - [Lambda]람다식람다식은 아니지만 표현이 매우 유사하기에 람다식을 안다면 바로 이해하실 수 있을 것입니다. 클로저 Closure: 함수 안에 함수 콜백함수Callback Function: 자신이 아닌 다른 함수에, 인수로 전달된 함수. main함수에서 인수param으로 함수를 받고 있습니다.main(sub);→ 여기에서 인수로 잔달된 sub함수를 콜..

✨ UI/💛 JS 2024.12.26

[JS]기본 작성법

🌟 변수 선언법JS에서 변수선언은 let과 const를 사용한다고 보면됩니다.(var도 쓰이긴 하지만..)변수 선언은 아래 포스트에 작성했기 때문에 이 포스트에서 적지 않았습니다.2023.06.10 - [✨ UI/💛 JavaScript] - [JS]변수타입 var, let, const2023.06.06 - [✨ UI/💛 JavaScript] - JavaScript와 Java는 다른 언어입니다작성법과 기능이 많이 다를 뿐, C언어를 기반으로해 변수선언규칙이나 타입종류는 자바와 거의 동일합니다.  주석///* */  // 한 줄만 주석처리 합니다./* */ 여러 줄을 주석처리 합니다.🌟 // 의 단축키 Ctrl + /  함수function 함수명() {   }  html 태그 js로 가져오기docum..

✨ UI/💛 JS 2024.12.25

MDN Web Docs:HTML, CSS, JS 등 웹표준과 정보제공 커뮤니티

https://developer.mozilla.org/ko/ MDN Web DocsThe MDN Web Docs site provides information about Open Web technologies including HTML, CSS, and APIs for both Web sites and progressive web apps.developer.mozilla.org html, css, js는 java보다 몇 배는 더 다양한 기술들이 있고 더 많이 업데이트되는데, 그 만큼 비권장된 코드도 더 많습니다. 또한 여러 기종의 전자기기등을 아우를 수 있는 웹 표준을 확인하고연습할 수 있습니다.

[JS]자바스크립트란? + 작성법

자바스크립트는 동적이다. HTML은 정적으로 표현하지만(1+1을 입력하면 그대로 1+1이 창에 뜬다),자바스크립트는 1+1을 입력하면 계산기처럼 2가 나오게 할 수 있다.따라서 동적이다.자바스크립트는 사용자와 상호작용이 가능하도록 구현한다.주로 버튼 클릭 시 알림 창을 띄우거나, 입력된 데이터를 처리하여 화면에 표시하는 등의 인터랙티브 기능을 처리합니다. ※ JS와 JAVA는 전혀 다른 언어이지만, C언어를 기반으로 만들어져 비슷한 부분이 꽤 많습니다.2023.06.06 - [✨ UI/💛 JavaScript] - JavaScript와 Java는 다른 언어입니다  작성법 세가지   인라인inline방식 : html 태그 안에 on~으로 시작하는 Event를 만드는 것입니다.   내부 작성internal방..

✨ UI/💛 JS 2024.12.24

[CSS]선택자 종류와 사용법

HTML에 적은 선택자를 CSS에서 사용하는 방법에 대해 알아보겠습니다.2024.12.22 - [✨ UI/💗 HTML] - [HTML]선택자 selector. id, class, name   #id명 {  }.class명 {   }  🌟 id와 class 선택자는 jquery에서도 #와 .로 동일하게 사용되기에 기억해두는 편이 좋습니다.  선택자 우선순위  속성 값 뒤에 !important를 붙인 속성.important { color: red !important;}인라인 스타일This is a paragraph.#id로 지정된 속성#unique { color: green;}class, attribute, 및 pseudo-class로 지정된 속성.class-name { color: purple;}..

✨ UI/💙 CSS 2024.12.23

[HTML]데이터 전달 <Form>과 그 안의 요소들(input, select...)

: server단으로 넘기는 정보를 모아 놓는 태그.   action="./form1_res.html" method="get">⭐ action = "데이터를 전달할 링크"submit 버튼을 클릭하면 실행됩니다.method = "get 또는 post" get데이터가 보여지면서 전달된다.보안이 덜 중요한 경우 사용.example) 검색 쿼리, 필터링된 리스트, 페이지 네비게이션post데이터가 숨겨져서 전달.보안이 중요한 경우 사용.example) 사용자 인증, 데이터 입력/저장, 파일 업로드. : 창제목. type="radio" name="radio" value="y">type : 타입에 따라 모양이 바뀝니다.checkbox : 여러개 선택 가능.radio : name이 같을 경우, 하나만 선택 가능하다.r..

✨ UI/💗 HTML 2024.12.22

[CSS]css란? 적용법, 주석

Cascading Style Sheets: 문서 스타일을 지정해주는 언어.     속성 : value; 속성 : value;..  인라인 스타일시트inline StyleSheethtml태그 안에 사용하는 방법.stype=" " 안에 css를 작성한다.   내부 스타일시트internal style sheet 를 이용하여 css를 작성하는 방법.란 안에 작성한다.   외부 스타일시트external style sheet: css파일을 따로 만들어 연결하는 방법.태그 안에 를 적어 사용합니다. ※ css를 적는 다양한 방법을 적어놨지만 인라인, 내부, 외부 이런 단어를 외울필요는 없습니다.🌟 보통 외부 스타일시트 방식을 사용합니다.  /* 주석 */

✨ UI/💙 CSS 2024.12.22

[HTML]선택자 selector. id, class, name

선택자를 사용하는 이유겸 예시    더보기 Happy Marry Christmas🎄   💡 결론html에서 선택자는 css, sciprt, server단에서 유용하게 사용하기 위해서 사용됩니다.  id, class, name id중복불가.id는 문서 내에서 유일해야 합니다.class중복가능.여러 태그를 묶기 위해 사용합니다.name주로 태그 안에 사용하는 태그들에서만 사용됩니다.서버로 전송되는 데이터의 이름을 지정합니다.🌟 보통 id를 사용하고, 태그들을 묶을 때는 class, 태그 안에서만 name을 사용한다고 보면됩니다.💡 선택자 대소문자를 가리지 않고 영어로 시작하면됩니다.

✨ UI/💗 HTML 2024.12.22

[HTML]이미지 img

폴더 위치src-webapp-resources-img   이미지 삽입  alt = "이미지를 설명. 이미지가 보이지 않을 경우, 이미지 설명 텍스트"src = "이미지 경로"title = "인용문(마우스 올리면 뜨는 거)"width : 가로 크기 지정.height : 세로 크기 지정.href를 넣어 하이퍼핑크를 거는 것도 가능하다. 🌟 이미지에서 하이퍼링크 걸 때 선택할 수 있는 범위 축소하기에 usemap="사용할  map 이름"추가.태그에 name="이름"을 적고 안 태그에 링크를 넣는다.coords="n, n, n, n"으로 클릭 범위를 지정한다.

✨ UI/💗 HTML 2024.12.22
반응형