비디오 튜토리얼: 자바스크립트 및 제이쿼리 배우기

최고의 자바스크립트 및 jQuery 강의에 환영합니다.

이 동영상에서는 JavaScript가 무엇인지와 우리에게 어떤 이점을 제공하는지 설명됩니다.

이 비디오에서는 우리가 사용할 편집기와 함께 설치하는 방법을 배웁니다.

이 동영상에서는 자바스크립트를 사용하여 클릭을하는 방법과 변수가 어떻게 작동하는 지 설명됩니다.

if문. If (번역: 만약)은 프로그래밍에서 매우 자주 사용됩니다. 예를 들어, 특정 조건이 충족될 때에만 어떤 작업을 수행하고 싶은 경우에 사용됩니다.

이 비디오에서는 JavaScript에서 배열 (배열)에 대해 얘기합니다. 이를 통해 하나의 변수 내에 여러 정보를 저장할 수 있습니다.

이 동영상에서는 For-Loops(루프)를 배우게 됩니다. 이를 통해 특정 코드를 여러 번 연속해서 실행할 수 있습니다.

기능들은 우리가 만든 미니프로그램의 일종이며, 한 번 만들어 놓으면 언제든 다시 사용할 수 있습니다. 핸드폰에서 예를 들어 홈 버튼을 누르면, 홈 화면으로 돌아가는 기능이 호출됩니다. 따라서 기능들은 업무를 훨씬 쉽게 만들어 줍니다.

이곳에서는 도전 과제의 결과가 표시되며 (즉, 퀴즈가) HTML 기초가 마련됩니다.

여기에서 퀴즈의 CSS(외관)가 프로그래밍됩니다.

여기서는 퀴즈의 JavaScript가 프로그래밍되고 설명됩니다.

넌 이미 1개의 매개변수로 작동하는 함수를 보았다. 이제 여러 매개변수를 가진 함수들을 살펴보자. 여러 매개변수를 사용하면 함수를 여러 다른 변수로 사용할 수 있다. 수학에서 예를 들어 여러 값의 덧셈.

전역 변수와 지역 변수가 있습니다. 간단히 말해서, 전역 변수는 함수 외부에서 만드는 변수이며, 지역 변수는 함수 내에서 만드는 변수입니다. 여기서는 이 동작이 어떻게 이루어지는지 자세히 살펴보겠습니다.

프로그래밍 언어에서는 함수를 반환 값이 있는 방식으로 설정할 수 있다. 지금까지는 함수가 실행만 하고 아무것도 반환하지 않았던 함수만 다뤘었는데, 반환값으로 계속 작업할 수 있는 함수가 어떻게 구성되는지 살펴보겠습니다. 그래서 이제 RETURN에 대해 알아보겠습니다.

이 기사에서는 수학 연산자와 할당 연산자를 다룰 것입니다. 수학 연산자는 덧셈, 뺄셈 등과 같이 매우 단순한 것들이며, 할당 연산자는 5 증가와 같이 매우 쉽게 단순한 작업을 수행하는 기회입니다. 프로그래밍에서 두 가지가 중요하기 때문에 이 두 주제가 여기에서 다루어집니다.

프로그래밍에서는 세 가지(또는 네 가지) 종류의 루프가 있습니다: Do-while 루프, While 루프, For 루프. For 루프는 이미 배웠습니다. 이제 Do-while 루프(footer-controlled)와 While 루프(head-controlled)에 대해 알아보겠습니다.

이 문서는 If 조건에 대한 대안인 Switch(스위치) 및 Case(케이스)에 대해 다룹니다. 마치 다양한 경우를 돌아다니며 활성 상태인 것에 멈추는 스위치가 있는 것과 같습니다.

우리는 이미 배열을 다루었지만 세부 사항에 대해서는 다루지 않았습니다. 배열에 대해 알아야 할 많은 것이 있습니다. 자바스크립트 배열의 가장 중요한 속성은 요소의 수(length)입니다. 배열에는 index와 같은 추가 속성이 있으며, 이는 배열의 위치 0에 대한 정보를 제공합니다.

객체는 많은 프로그래밍 언어에서 극히 중요하고 흥미로운 개념입니다. 기본적으로 모든 것을 객체로 설명할 수 있습니다. 거리에서 주로 볼 수 있는 객체를 한 번 생각해 봅시다: 자동차. 자동차는 특정한 특성을 가지고 있고 특정한 작업을 수행할 수 있습니다.

자바스크립트에서 객체를 만드는 방법을 살펴보겠습니다. 이를 위해 생성자 함수를 생성하고, 헤드 태그 안에 객체의 두 인스턴스를 만듭니다. 객체와 동일한 이름을 가진 생성자 함수 안에서 객체의 인스턴스를 생성할 때 전달되는 매개변수가 해당 객체의 값이 되도록 프로그램에게 알려줍니다.

객체 기능의 기초로 시작하기 위해 우리는 지난 자습서의 코드로 시작하겠습니다. 여기서는 우리 객체의 각 인스턴스에 생성되는 변수를 만들었습니다.

이 튜토리얼에서는 Math 객체에 대해 배우게 됩니다. 여기에는 Math 클래스를 기반으로 한 여러 멋진 속성과 함수가 있는 객체가 포함되어 있습니다.

이 비디오에서는 Date 객체나 Date 클래스에 대해 이야기합니다. 이러한 객체들은 프로그램에서 시간을 표시하는 데 사용할 수 있습니다. 여기서 시간이라고 하면 반드시 시간이나 날짜만 의미하는 것은 아니며, 시간 간격을 의미할 수도 있습니다. Date 객체는 1970-01-01 00:00:00 이후로 경과한 시간을 포함합니다. Date 생성자에 인수를 전달하는 여러 가지 방법이 있습니다.

이 비디오에서는 JavaScript로 인터랙티브 시계를 만드는 방법을 배울 것입니다.

이 비디오는 상속과 다형성에 관한 내용입니다. 객체 지향 프로그래밍의 두 가지 개념입니다.

이 기사에서는 질문을 다룹니다: jQuery란 무엇인가요? jQuery는 더 멋진 웹 사이트를 만들 수 있도록 해주는 자바스크립트 라이브러리입니다.

여기서는 jQuery를 사용하여 클릭을 훨씬 쉽게 처리하는 방법을 배울 수 있습니다.

이 튜토리얼에서는 jQuery를 사용하여 웹 페이지의 모양을 어떻게 변경할 수 있는지 배우게 됩니다. 이를 위해 우리는 쉽게 필드의 속성을 덮어쓸 수 있습니다. 이 예시에서는 마우스를 올리면 iframe의 링크(src/source)를 변경할 수 있습니다. 코드를 손쉽게 수정하여 마우스를 올리면 높이와 너비 속성을 덮어쓰기하여 사각형을 확대할 수 있습니다. 이제 이 절차를 사용하여 웹 페이지의 모양을 쉽게 변경할 수 있습니다.

jQuery의 멋진 기능 중 하나는 요소를 사라지게하는 것입니다. 이 예에서는 다른 버튼을 클릭할 때 한 버튼을 사라지게합니다. 이때 우리는 FadeOut 함수("사라지게하는 함수")를 사용합니다. 그 요소를 다시 표시하려면 FadeIn 함수를 사용합니다.

이 동영상에서는 jQuery에서의 애니메이션에 대해 다룹니다. 여기에는 움직이는 것이 포함됩니다. 따라서 우리는 웹사이트에서 요소가 움직이거나 변경되도록 합니다. 이를 위해 jQuery에는 animate() 함수가 있습니다. 이 함수는 세 개의 매개변수를 기대합니다.

우리가 jQuery UI가 무엇인지 살펴보자.

악코디언은 아코디언처럼 특정 부분만 볼 수 있게 해주는 위젯입니다. 많은 정보를 전달하고 싶지만 큰 텍스트로는 매우 혼란스러울 때 특히 유용합니다

이 튜토리얼에서는 jQuery UI의 Sortable에 대해 다룹니다. 이는 정렬 가능한 요소들을 의미합니다. 당신이 Wunderlist 또는 Trello와 같은 생산성 웹사이트를 사용할 때 이미 알고 있을 것입니다. 요소를 정렬 가능하게 하는 기능은 다양한 응용 프로그램에서 사용할 수 있는 매우 멋진 기능입니다.

가끔 사용자가 요소의 크기를 조절하고 싶어하는 경우가 있습니다. 그럴 때, Resizables가 딱 맞습니다. 이것들은 정확히 그것을 가능하게 하죠. 사용자는 요소의 오른쪽 아래 모서리에 작은 삼각형을 볼 수 있으며, 이를 클릭하여 마우스를 들고 해당 요소를 확대 또는 축소할 수 있습니다.

jQuery UI에서 Draggables를 사용하면 간단히 드래그할 수 있는 요소를 만들 수 있습니다. 어떻게 하는지 여기서 살펴봅시다.

진행 막대 또는 진행 표시줄은 사용자에게 어느 정도의 프로세스를 따라 진행 중인지 알려주는 훌륭한 수단입니다. 예를 들어 온라인 쇼핑몰의 구매 과정이나 설문조사에서 사용자에게 단계별 진행정도를 알려주는 데 도움이 됩니다.

이 튜토리얼에서 나는 jQuery UI의 효과에 대해 간단히 설명하고 싶습니다. 실제로 웹 사이트를 더 멋지게 만들 수 있고 사용자들을 완전히 놀라게 하는 아주 멋진 효과들이 있습니다.

이 비디오에서 도전의 결과를 볼 수 있습니다. FAQ 페이지.

여기서 FAQ 페이지를 구현하겠습니다.

이 비디오에서는 이 장에서 프로그래밍되는 브레인 게임이 소개됩니다.

먼저 우리는 게임의 구조와 외관에 신경 쓸 거에요.

이제 게임의 일부 기능을 다루겠습니다.

플레이어는 이미 게임에서 처음 액션을 수행할 수 있습니다, 이제 게임을 올바르게 다시 시작하고 종료할 수 있도록 처리해야 합니다.

이제 할 일은 타이머를 게임에 통합하여 점수를 올바르게 계산하고 게임을 시간 제한을 두는 것입니다. 또한 게임을 완료하기 위해 몇 가지 추가 단계를 더 진행합니다.

이곳에서는 챕터의 앱을 소개합니다. 이는 할 일 목록 앱/웹사이트입니다.

이제 우리는 기반을 마련하고 jQuery Mobile로 해당 테마를 생성하고 편집하는 방법을 알아볼 것이다.

우리는 OOP 접근 방식을 채택하기 때문에 적절한 아키텍처를 구축해야 합니다. 그래서 여기서 처리하겠습니다.

이 비디오에서는 페이지를 추가하고 과제를 생성하는 페이지를 다루고 있습니다.

투자 페이지와 마찬가지로 편집 페이지도 작성되고 해당 기능을 갖추어야 합니다.

이제 우리는 아키텍처에 대해 다시 생각하고 데이터 구조를 만들 수 있습니다.

이제 데이터 구조가 준비되었으므로 UI에서 해당 데이터를 쉽게 호출할 수 있습니다.

프로그래밍 중 "설명 흐름"에서 몇 가지 단계가 필요했었는데 이제 우리가 고칠 수 있습니다. 추가로 데이터의 영구적 저장과 앱을 완성하는 일도 처리하고 있습니다.