Dev study and notes

바닐라 JS로 크롬 앱 만들기 #2.0 Your First JS Project 노마드코더 무료강좌 본문

Building & Learning/바닐라JS-노마드코더

바닐라 JS로 크롬 앱 만들기 #2.0 Your First JS Project 노마드코더 무료강좌

OPENLUNCH 2024. 12. 22. 11:15
반응형

바닐라 JS로 크롬 앱 만들기 #2.0 Your First JS Project 노마드코더 무료강좌​

안녕하세요 데브런치입니다.
노마드코더에서 제공하는 자바스크립트 무료강좌 '바닐라 JS로 크롬 앱 만들기'의 진행을 기록으로 남겨봅니다.

 바닐라 js는 순수한 자바스크립트(javascript)를 사용하는 것으로 외부 라이브러리나 프레임워크를 쓰지 않는 순수 JavaScript를 이르는 말입니다.
 강좌 진행에 앞서 기본적으로 간단한 html, css, javacsript 언어를 알고 있다면 쉽게 따라하면서 진행할수 있습니다.

유튜브를 통해 무료강좌를 보며 진행하면 됩니다.

​https://youtu.be/5xj5DjyQK_8

 

저의 경우 replit에서 진행을 했습니다. 이후 vscode

순수한 자바스크립트 사용이므로 따로 개발환경없이 진행이 가능할 것이라 생각했기 때문입니다.

​

10분 내외로 진행이 되며 작성한 코드를 남겨봅니다.

 

* app.js

alert("hi");

* style.css

body {
  background-color: beige;
}

 

* index.html

<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <link href="style.css" rel="stylesheet" type="text/css" />
    <title>Replit-nomad-vanila-js</title>
  </head>

  <body>
    <script src="app.js"></script>
  </body>
</html>

 

아주 간단한 코드입니다.

​

기본 웹브라우저에 보일 html에 스타일과 디자인을 구성 할 css, 기능 구현을 할 js를 작성한 것입니다.

복습겸 진행하며 간단하게 기록을 잘 남겨보겠습니다.

​

끝!

 

반응형
저작자표시 비영리 동일조건

'Building & Learning > 바닐라JS-노마드코더' 카테고리의 다른 글

바닐라 JS로 크롬 앱 만들기 6장 강좌들 노마드코더 무료강좌  (0) 2025.01.17
바닐라JS로 크롬 앱 만들기 5장 강좌들 노마드코더 무료강좌  (0) 2025.01.17
바닐라 JS로 크롬 앱 만들기 4장 강좌들 노마드코더 무료강좌  (0) 2024.12.22
바닐라 JS로 크롬 앱 만들기 3장 강좌들 노마드코더 무료강좌  (1) 2024.12.22
바닐라 JS로 크롬 앱 만들기 2장 강좌들 노마드코더 무료강좌  (0) 2024.12.22
'Building & Learning/바닐라JS-노마드코더' Related Articles more
Comments