JavaScript 기술 향상을 위한 25가지 무료 JavaScript 튜토리얼
게시 됨: 2022-03-08프론트엔드 프로그래밍은 2021년에 계속 증가했으며 2022년에는 프론트엔드 언어의 또 다른 거대한 성장 단계를 예상할 수 있습니다. 수백만 명의 새로운 웹 사용자가 연결되고 있으며 그들 모두는 결국 컴퓨터 과학, 웹 개발에 대해 배울 것입니다. , 그리고 프로그래밍. JavaScript는 Java와 같은 구시대의 고전을 능가하는 프로그래밍 언어 라이브러리의 리더로 자리 잡았습니다. 일부는 JavaScript가 정점에 도달했다고 말합니다. 우리는 아직 상승할 여지가 있고 프로그래밍 언어 선택을 지배한다고 생각합니다.
ECMAScript 6은 이미 한창 진행 중이며 누군가 ES6에 대해 쓰지 않고 새롭거나 노련한 JavaScript 개발자를 위한 테이블에 제공하는 내용을 작성하지 않은 날이 하루도 없습니다. JavaScript의 미래는 두 가지 모두 훌륭해 보입니다. 웹 및 소프트웨어 개발자. 하드웨어 및 소프트웨어 엔지니어링은 특히 Node.js와 같은 인기 있는 프레임워크를 통해 JavaScript가 지배적인 두 가지 새로운 영역입니다. JavaScript는 매 순간 새로운 시장에 도달하고 있습니다. 많은 언어가 따라잡기가 어려울 것이며 JavaScript 이면의 커뮤니티 파워는 다른 언어가 더 낫다는 것을 암시할 수 있는 많은 논리적이고 합리적인 주장을 능가합니다. 다음 직업에 적합한지 알아보기 위해 무언가를 분석하는 것은 스스로에게 몇 가지 정직한 질문을 하는 것으로 귀결됩니다.
프로그래밍 언어로서의 JavaScript는 지속 가능하고 강력하며 신뢰할 수 있음을 세계에 입증했습니다. JavaScript를 배우는 것은 그 어느 때보다 흥미로웠고, 정규직과 프리랜서 모두 많은 직업, GitHub에서 계속 작업할 흥미로운 프로젝트, JavaScript 커뮤니티의 새로운 기사 및 자습서의 지속적인 흐름, 언어 생태계는 매우 건강합니다. 그것에 관해서는 매우 유용합니다. 우리는 기사의 품질이 최신 JavaScript 팁, 트릭 및 물론 표준과 일치하도록 보장하면서 지난 2-3개월 동안 게시된 수십 개의 JavaScript 튜토리얼 기사를 참여시켜 커뮤니티 측면에 기여하고자 합니다. , ES6과 같은.
ECMAScript 6에서 재사용 가능한 차세대 JavaScript 모듈 작성
Jim Cowart는 ES6을 이해하기 위해 많은 시간을 할애하고 개발자가 더 좋고, 더 빠르게, 더 탄력적으로 빌드하는 데 도움이 될 수 있는 ES6의 가장 비밀스러운 단점과 특성을 파악했습니다. 이 기사의 주요 의도는 웹 개발자가 ES5 컨텍스트 내에서 사용할 수 있는 ES6 라이브러리를 빌드하도록 돕는 것입니다. 즉, Jim은 또한 Babel을 사용하여 ES6 라이브러리를 완전한 기능을 갖춘 ES5 라이브러리로 변환하는 방법을 설명하고 보여줄 것입니다. 이렇게 하는 이유는 웹 브라우저가 여전히 새로운 표준을 따라잡기 위해 노력하고 있기 때문입니다. 라이브러리를 재사용 가능하고 다른 개발자와 쉽게 작업할 수 있도록 Jim은 모듈에 많은 초점을 맞추고 있으며 거의 모든 것에 적합한 모듈을 제공하고 있습니다.
D3.js로 데이터 시각화를 만드는 방법 알아보기
웹 성장, 기술을 통한 비즈니스 성장, 일반 데이터 과학 목적의 현재 시대에서 데이터 시각화는 더 중요할 수 없습니다. 그리고 매우 구체적이어서 때로는 매우 재능 있는 소수의 사람들만이 지구상에서 가장 잘 알려진 미디어 사이트의 관심을 끄는 종류의 시각화를 만들고 있습니다. 항상 합법적인 것은 아니지만. 데이터 시각화는 간단한 데이터 세트를 시각화하고, 웹사이트의 성능을 분석하고, 분석 데이터에 대해 더 깊이 파고드는 데 도움이 될 수 있습니다.
수년에 걸쳐 JavaScript는 브라우저 내에서 데이터를 정확하고 효과적으로 처리하고자 하는 데이터 과학자들 사이에서 인기 있는 도구가 되었습니다. 2011년 D3.js가 출시된 이후로 라이브러리는 가능한 경쟁을 능가했습니다. 복잡한 데이터 과학 작업을 수행하기 위해 복잡한 도구가 필요한 JavaScript 개발자를 위한 가명입니다.
프런트 엔드 애플리케이션 라이브러리 및 구성 요소 아키텍처
Cody Lindley는 가장 인기 있는 JavaScript 프레임워크 및 라이브러리 내에서 기본 JavaScript 구성 요소가 어떻게 동일해졌는지 개발자가 학습할 수 있도록 도와주는 튜토리얼과 같은 역할을 하는 독창적인 JavaScript 기사를 작성했습니다. 이 개념을 이해하면 작업할 프레임워크나 라이브러리 중에서 선택하기가 더 쉬워집니다. 갑자기 마지막 프레임워크와 동일한 구성 요소 구조를 사용하기 때문에 새로운 것을 배우는 것이 그렇게 많은 작업이 아니라는 것을 깨닫게 되기 때문입니다.
2016년 React.js 모범 사례
React는 2015년에 온통 뉴스였습니다. 커뮤니티에서 지난 몇 년 동안 가장 빠르게 성장하는 JavaScript 라이브러리이며 여전히 매일 수십만 명의 개발자가 활발히 사용하고 있습니다. React를 사용하면 작업 중인 프로젝트의 다른 측면을 방해하지 않는 기본 UI 인터페이스를 매우 간단하게 구축할 수 있으므로 어떤 의미에서는 React를 사용하여 UI를 구축하거나 React를 사용하여 스스로 구축할 수 있습니다. 더 나은 UI, 그리고 어떤 시점에서도 React는 메인 라이브러리의 역할을 맡지 않으며 대신 요청할 때만 작동합니다. 모든 것이 간단하게 들리지만 여전히 학습 곡선이 있으며 RisingStack의 CTO인 Peter Marton은 자신의 관점에서 React의 모범 사례에 대해 모든 것을 말하고 있습니다.
Ember가 처음이신가요? 여기에서 시작하십시오! (2016년 튜토리얼)
우리는 이미 Ember에 대한 의견을 정립했습니다. Ember는 최근 기사 중 하나에 완벽하게 들어맞는 현대적인 웹 개발 프레임워크입니다. 최고의 자바스크립트 프레임워크. Ember를 사용하면 JavaScript 개발자가 다른 라이브러리가 함께 제공할 수 있는 기능을 많이 손상시키지 않고 데스크톱 및 모바일 장치용 최신 웹 응용 프로그램을 빠르게 만들 수 있습니다. Ember가 처음이고 최근에 Ember에 대해 들어본 적이 있다면 Frank Treacy의 이 자습서를 살펴보는 것이 좋습니다. 그의 작문 스타일과 지도는 Ember Framework를 더 깊이 이해하는 데 완벽합니다.
ES6를 배우는 방법
많은 JavaScript 개발자는 표준이 출시되기 훨씬 전부터 ES6이 무엇인지 알고 있었습니다. 이것은 프로그래밍 언어의 방식이며 표준은 최종 결정이 이루어지기 전에 커뮤니티가 실험할 수 있는 초안으로 제공됩니다. ECMAScript 7 또는 ES7 도 마찬가지입니다. 기능은 이미 사용 가능하지만 모두가 브라우저에서 따라잡기를 기다리고 있습니다. 이는 항상 원활한 프로세스는 아닙니다. Eric Elliott는 ES6 학습 프로세스에 더 잘 접근하는 방법에 대한 자신의 Medium 게시물에서 편리한 기사 및 팁을 수집했습니다.
JavaScript의 함수 정의
Marius Schulz는 JavaScript 개발자에게 JavaScript에서 함수 정의가 작동하는 방식과 특히 ES6 및 Arrow Functions 릴리스 이후에 세 가지 다른 방식으로 접근할 수 있는 방법에 대한 약간의 통찰력을 제공합니다.
webpack 및 ES6을 사용하여 나만의 JavaScript 라이브러리 시작
JavaScript 라이브러리는 개발자가 별도로 생성해야 하는 특정 기능으로 프로젝트를 확장하는 데 도움이 되는 아주 작은 JavaScript 스크립트(항상 작지는 않음)입니다. 어떤 사람들은 React.js가 라이브러리 역할을 한다고 말하고 어떤 사람들은 그것이 프레임워크에 가깝다고 말합니다. 어떤 경우이든 Krasimir Tsonev는 ES6과 WebPack의 도움으로 JavaScript 라이브러리를 만드는 과정을 좁히고 있습니다.
7가지 필수 자바스크립트 함수
David Walsh는 많은 프론트 엔드 개발자, 일관된 개발자 및 프론트 엔드 세계와 자신의 생각, 의견 및 경험을 공유하는 것을 두려워하지 않는 작가 중 가장 좋아하는 사람입니다. 그의 웹사이트는 네이티브 개발이 얼마나 멀리 갈 수 있는지, 콘텐츠 웹사이트의 형태로 얼마나 아름답게 실행될 수 있는지를 보여주는 좋은 예입니다. 그러나 그의 게시물은 디자인이 아니라 JavaScript 기능에 관한 것입니다. 언어의 필수적인 부분은 기능입니다. David는 우리가 언어와 더 중요한 측면을 배우는 동안 포기했을 수 있는 추가 7가지 기능을 제공하고 있습니다.
GMaps.js로 쉽게 만드는 Google 지도
웹의 모든 것은 선택 기능을 수행하는 특정 요소인 요소로 귀결됩니다. 지도의 경우 공식 Google 페이지에서 기본 Google 지도 위젯을 사용하거나 독립형 위젯에서 얻을 수 있는 것보다 약간 더 많은 기능을 제공하는 타사 라이브러리에 의존할 수 있습니다. 여기에 GMaps.js 라이브러리에 가장 잘 접근하고 지도를 최대한 활용하는 방법에 대한 자습서가 있습니다.
JavaScript 개발자 설문조사 결과
설문조사는 튜토리얼처럼 들리지 않을 수 있지만 어떤 의미에서는 그렇습니다. 그것들은 커뮤니티에 대한 튜토리얼, 커뮤니티가 생각하는 방식, 커뮤니티가 최신 진화를 감안할 때 JavaScript에 접근하는 데 가장 적합하다고 생각하는 것입니다. 예, 이 설문조사를 사용하여 JavaScript 개발자, 그들의 의견 및 권장 사항에 대해 자세히 알아보고 이러한 통찰력을 자신의 생산적인 워크플로에 통합할 것을 권장합니다.
유니버설 리액트
React와 같은 라이브러리는 클라이언트 측 앱이 생성되는 방식을 변경했습니다. 이 프로그래밍 방식에는 많은 이점이 있으며 성능이 향상되고 접근성이 더 쉽습니다. 여전히 단점이 있으며, 단점 중 하나는 JavaScript 지원 브라우저가 없는 사용자나 JavaScript와 잘 작동하지 않는 검색 엔진 로봇이 없는 사용자에게 JavaScript 콘텐츠를 제공해야 한다는 것입니다. 좋은 소식은 이 문제가 인식되었고 서버에서 렌더링할 수 있는 완전한 기능을 갖춘 클라이언트 측 애플리케이션을 구축할 수 있다는 것입니다. React는 서버 측 및 클라이언트 측 JavaScript 실행을 현실로 만드는 데 앞장서고 있으며 Jack Franklin은 이 문제와 해결 방법을 자세히 살펴보는 자습서를 게시했습니다.
JavaScript에서 백그라운드 작업을 예약하는 방법
Craig Buckler는 JavaScript에서 백그라운드 작업이 작동하는 방식과 가장 잘 접근하는 방법에 대한 간결한 설명을 제공합니다. Craig Buckler는 SitePoint에 대해 수천 편의 기사를 작성했으며 JavaScript, HTML5 및 CSS3과 같은 언어에 대한 광범위한 경험을 가지고 있습니다.
RSS 피드는 웹에 게시된 콘텐츠를 훨씬 더 쉽게 액세스할 수 있도록 합니다. 오늘날 블로그의 99%가 RSS 피드를 지원하므로 다른 사람들이 피드를 사용하여 정기적으로 콘텐츠를 쉽게 받을 수 있습니다. 피드의 다른 용도로는 피드를 구문 분석한 다음 구문 분석된 데이터를 다양한 방식으로 사용하는 기능이 있습니다. 링크 팜 웹 사이트 또는 구문 분석된 RSS 피드의 특정 데이터 세트가 필요한 애플리케이션에 대해 Raymond Camden은 이 주제를 자세히 살펴봅니다. JavaScript를 사용하여 RSS 피드를 구문 분석하려는 JavaScript 개발자를 위한 가능한 옵션을 계산합니다.
Dudley Storey는 자신의 웹사이트를 JavaScript 프레임워크에서 완전히 무료로 만들고 대신 Vanilla JavaScript를 사용하여 독자를 위한 대화형 웹 브라우징 경험을 구축한 방법에 대한 자신의 이야기를 공유합니다. 그의 최근 창작물은 개별 페이지 요소를 회전하는 방법에 대한 자습서였습니다. 바닐라 자바스크립트를 사용합니다. 웹 프로젝트에서 JS를 사용하는 다른 많은 대화식 방법에 대한 문을 열어줄 매혹적인 튜토리얼입니다.
React, Redux 및 Immutable.js를 사용하여 Todo 앱을 빌드하는 방법
React, Redux 및 Immutable.js는 빠르게 발전하는 JavaScript 라이브러리 이름으로, 개발을 인식하는 방식과 모든 기기용 앱을 빌드하는 방식을 변화시키고 있습니다. Emre Guneyler는 이 기사에서 세 가지 라이브러리에 대한 간략한 소개와 최신 프레임워크 및 라이브러리를 사용하여 앱을 빌드하는 방법에 대한 더 나은 보기를 제공하는 단일 'todo 앱'을 빌드하는 방법을 제공합니다.
Angular 1 코드를 Angular 2로 준비하는 5단계
우리는 Angular.js의 열렬한 팬입니다. 반응형 AngularJS 웹 사이트 템플릿, AngularJS 관리 템플릿 및 Angular 2용 커뮤니티 리소스와 같은 최고의 Angular.js 콘텐츠를 확인하세요. 우리는 Angular 2를 환영할 준비가 되어 있으며 심지어 Oren Farhi의 이 튜토리얼을 추가하면 더욱 그렇습니다. Angular 2의 출시는 불가피하며 현재 Angular.js 개발자라면 이 튜토리얼을 읽고 다가올 변경 사항에 대비하고 코드를 새 버전으로 쉽게 전환할 수 있도록 준비하세요.
350개의 글머리 기호로 된 ES6 개요
ES6은 최근 몇 년 동안 JavaScript 표준에 대한 가장 큰 업데이트였습니다. 이미 견고한 프로그래밍 언어에 추가된 것입니다. 그러나 이 추가는 JavaScript가 웹에서 작동하는 방식을 진정으로 바꿉니다. 브라우저가 까다로운 기능을 더 많이 통합하기 시작함에 따라 계속 작동하는 방식입니다. 이 GitHub 리포지토리는 기능과 같은 ES6의 다양한 측면과 이러한 기능을 사용하는 방법을 논의하는 350개 이상의 글머리 기호 조합입니다. 또한 기능과 새로운 기능의 모습, ES6에 대한 이해를 심화하는 데 도움이 되는 많은 리소스 링크를 제공합니다.
동시성 JavaScript: JS의 동시성에 대한 3부작 시리즈
Kyle Simpson이 잠시 시간을 내어 JavaScript 동시성 및 비동기성에 대한 생각과 개발 환경에서 동일한 개념을 사용하는 방법을 공유합니다. 매혹적인 콘텐츠, 그리고 세 부분으로 나누어진 심도 있는 튜토리얼.
프레임워크 비용
프레임워크를 사용하여 모든 문제를 해결하는 방법에 대한 집중적인 조언을 얻지 않고 JavaScript로 코딩하는 방법을 배우십시오. 요즘 JavaScript 학습의 대부분은 React, Angular, Backbone 등과 같은 프레임워크를 기반으로 합니다. 예, 프레임워크를 사용하면 웹 및 모바일 앱을 빠르게 구축할 수 있지만 기본(바닐라) JS가 아닌 프레임워크를 사용하는 실제 비용은 얼마입니까? Paul Lewis는 새로운(그리고 아마도 노련한) 개발자가 더 나은 프레임워크를 선택하는 데 도움이 되는 간결한 벤치마크 분석을 조합하여 이를 설명합니다.
대형 Angular 애플리케이션의 구조
Angular는 현재 빠른 웹 앱 구축을 위한 최고의 JavaScript 프레임워크입니다. 그러나 확장되고 큰 Angular 앱을 빌드하는 것은 까다로울 수 있습니다. 일부에서는 사용자가 미쳐버릴 지경에 이르렀다고 말합니다. 그래서 Kristian Poslek은 시간을 내어 튜토리얼을 제공하여 커뮤니티에 환원하고 있습니다. 미쳐버리지 않고 대규모 Angular 애플리케이션을 구축하는 방법에 대해 설명합니다.
JavaScript를 사용한 얼굴 근접 감지
프로그래밍 언어는 매일 점점 더 지능화되고 있습니다. 그의 튜토리얼에서 Peter Bengtsson은 JavaScript를 사용하여 앱과 프로젝트에서 바로 사용할 수 있는 얼굴 근접 감지 엔진을 구축하는 방법을 설명합니다.
JavaScript는 무엇을 할 수 있습니까?
JavaScript가 무엇을 할 수 있는지 완전히 확신하지 못하셨습니까? David Small은 JavaScript가 할 수 있는 일과 이 언어의 주요 목적에 대해 간단하지만 효과적인 프레젠테이션을 제공합니다. 언어의 보다 광범위한 측면을 가르치는 튜토리얼인 JavaScript에 관심이 있는 사람이라면 누구나 흥미롭게 읽을 수 있습니다.
JavaScript 피로에서 벗어나기 – React Edition
피로는 생산성을 떨어뜨리는 요인입니다. 너무 오래 작업하면 깊은 피로를 경험할 수 있으며 이는 오랜 시간 지속될 수 있습니다. 하지만 물론 특정 프레임워크에 기인하는 피로도 있습니다. 이 경우에 발생합니다. 리액트가 됩니다. 그렇다면 React에 대한 피로를 어떻게 해소할 수 있을까요? Reto Schlapfer는 이 질문에 대한 답을 가지고 있습니다.
JavaScript 온라인 학습을 위한 리소스
우리는 웹에서 제공하는 JavaScript에 대한 최고의 최신 자습서 중 일부를 탐색했지만 JavaScript에 대한 사전 지식이 없는 경우 이 모든 자습서를 사용하여 무엇을 하시겠습니까? 특히 JavaScript 자습서를 찾았기 때문에 가능성이 거의 없다고 생각합니다. 그럼에도 불구하고 JS 지식을 확장하거나 오랜 시간 부재 후 새로 고침을 원할 가능성이 있습니다. 이 경우 온라인에서 무료로 JavaScript를 학습할 수 있는 웹사이트 및 플랫폼 목록이 있습니다. 최고만.
- Codecademy — 웹 개발, 특히 JavaScript의 기초를 이해하기 위한 플랫폼입니다. Codecademy는 새롭고 야심 찬 프론트 엔드 개발자가 경력을 시작하는 첫 번째 사이트 중 하나입니다. 재미있고 대화식이며 작업을 잘 수행합니다.
- Learn-JS — Codecademy와 유사한 플랫폼으로, 다른 작업 세트와 학습 곡선이 있으며 Codecademy를 마친 후 새로 배운 기술을 개선하고 놓쳤을 수도 있는 부분을 알아차리는 데 매우 유용합니다.
- freeCodeCamp — 사이트의 모든 구성원이 문제와 과제를 해결하는 데 참여할 수 있는 빠르게 진화하는 커뮤니티 기반 코딩 플랫폼입니다. 윈-윈 상황입니다.
- 스타일 가이드 — 스타일 가이드는 다른 사람들이 쉽게 구축할 수 있는 코드를 작성하는 데 도움이 되며 AirBNB는 자체 스타일 가이드를 출시했으며 GitHub 또는 그 밖의 모든 곳에서 찾을 수 있는 가장 인기 있는 JavaScript 스타일 가이드가 되었습니다.
결론적으로 JavaScript를 배우는 것이 그렇게 큰 문제가 되어서는 안 된다는 것은 매우 명백합니다. 활동적인 개발자는 언어를 최대한 활용하는 방법뿐만 아니라 더 나아지는 방법에 대한 조언, 통찰력 및 자습서를 지속적으로 공유하고 있습니다. 이러한 리소스가 학습 과정에 최대한 도움이 되기를 진심으로 바랍니다.