블로그 이미지
잡다한 취미 생활 및 일상에 대한 소소한 이야기를 적어나가는 블로그입니다.
붉은kkk

공지사항

최근에 올라온 글

최근에 달린 댓글

글 보관함

calendar

1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31

리액트를 사용해서 기초 웹 서비스를 만들어 볼거에요.

 

우선 React App을 쉽게 만들어주는 곳을 찾아가서 시작해야겠죠?

아래 링크로 와서 설명대로 시작하면 됩니다.

 

Create React App

https://create-react-app.dev/docs/getting-started/#creating-an-app

 

 

 

Create React App · Set up a modern web app by running one command.

Create React App is an officially supported way to create single-page React

create-react-app.dev

npx create-react-app my-app

윈도우 환경에서는
cmd로 명령프롬프트를 뛰운다음 위 명령어를 입력하면 되요.

명령어대로 입력하면 자동으로 설치가 됩니다.

...

시간이 조금 지나면 설치가 완료 됩니다.

설치는 이렇게 마무리가 되었는데, 아직 뭘 해야될지 몰라서

공부를 하고 프로젝트를 만들고 난 뒤 이후 포스팅을 계속 하도록 할게요.

 

그럼 오늘도 즐거운 블로그 & 프로그래밍 생활 되세요.

오늘은 HTML에 자바스크립트 파일을 불러와서 실행되게 코드를 작성해 볼거에요.

 

그 전에, 자바스크립트를 배우고 알게 됨으로써 얻는 이득이 무엇인지 알려드릴게요.

저도 지금은 배우는 단계라서, 디테일한 내용들에 대해 알려드릴 수는 없지만 대략적으로 다음과 같은 것들을 

할 수 있다고 합니다. 

상세 내용은 아래 Table에!!!

참고 삼아 보시면 도움이 될 듯 합니다.

(아직 어떤 언어를 공부해야 될 지 모르는 분들은 그 언어로 무엇을 만들 수 있는지를, 그 언어가 무슨 프로그램 제작에 특화되어 있는지를 보고 선택적으로 취하시면 될 것 같네요.) 

자바스크립트로 할 수 있는 것들은 무엇이 있을까요?

What can you build with javascript?

1. Interactive websites
2. Apps
3. Games
4. Web Applications

Requirements
1. Web Broswer
2. Code Editor
3. Basic HTML and CSS knowledge is required!

 

그럼 오늘의 코드를 공개합니다.

지난 시간의 HTML파일 내에서 자바스크립트를 실행했던것을,

이번엔 자바스크립트 파일을 별도로 만들어서 호출하는 형태로 사용하였습니다.

지난 시간의 확장버전이라고 보시면 되요^^

코드 관리를 효율적으로 하려면 이렇게 별도의 파일로 작성하여 사용하는 것이 맞는 방법일 것 같네요.

(...답은 없답니다. 남들이 뭐라하건 나한테 맞으면 그게 맞는 방법이에요)

코드는 여전히 간단하죠^^
2.html파일과 script.js파일을 만들었어요.
두둥. 실행 완료. 잘 동작되네요^^

 

ㅎㅎ 저도 얼른 실력을 키워서 상호작용하는 웹사이트를 어서 빨리 만들어 보고 싶네요.

코딩 실력이 쌓이면 (코딩 실력이라고 쓰고... "구글링 실력 & 버그 잡기 & 내가 원하는 형태로 수정하기" 라고 읽어야 될까요?) 가능할테니까요. 

제가 생각하고 만든 서비스로, 어서 빨리 수익창출을 해보고 싶네요.

별도로 포스팅하는 창업 다마고찌 카테고리도 많은 관심 부탁 드립니다.

 

자바스크립트도 배우고 나면, 서비스를 만들거에요. 

그럼 오늘도 다 같이 즐거운 프로그래밍 생활 되세요^^

요즘 웹 프로그래밍에 대한 관심이 부쩍 늘어났습니다.

여러가지 이유가 있지만, 우선 앱 개발이 잠시... 침체기라서 그런거 같네요.

 

어떻게 접근을 할까 고민을 해봤는데... 역시나 프로그래밍의 시작은 그 언어로

"Hello world"를 출력하는게 시작이 아닐까 합니다.

 

그럼 시작해볼까요?

 

1. 우선 모두의 기본에디터인 메모장을 열어줍시다 ㅎㅎ

윈도우 메모장. 제가 즐겨 사용하고 있는 프로그램이랍니다.

2. 코딩을... 해야되는데?

   - 다음단계인 코딩은... 역시나 구글님에게 물어봅니다.

여기저기 자습서가 있답니다^^

3. 참고를 해서... 아래와 같이 코딩을 했답니다.

저장을 1.html파일로 해줬답니다.

 

4. 마지막 html 파일을 실행한 결과 ^^

원하는 출력을 얻을 수 있었습니다.

 

^^ 이로써, 자바스크립트 세계에 입문하였습니다.

하나하나 배워봐야겠네요.

 

즐거운 프로그래밍 생활 되세요. ㅎㅎ

이전 1 다음