안녕하세요. 좋은 영상 감사합니다. 저는 과거에 2003년경인가요 HTML 을 처음 배우고 드림위버인가요? 그걸로 배웠던거 같습니다. 제 전공은 전자공학이라 HTML 을 제외하면 웹개발 관련 지식은 거의 없습니다. 요즘에는 홈페이지들을 보면 그래프나 차트등도 이용되고요. 데이터베이스와 연동되어 자료 입출력 되는걸 볼수 있는데요. 이런 페이지들을 쉽게 비주얼베이직 MFC 와 같이 HTML 소스를 직접입력하지 않고 그려가며 해주는 툴은 없을까요? 드림위버가 관련툴인거 같은데 능동적인 차트(실시간 데이터그리기) 와 같은 홈페이지도 만들수 있는지 궁금합니다. 그리고 드림위버, 나모웹에디터와 같은 툴들이 많은데요.(HTML 태그 입력하지않고 페이지 제작하는 프로그램이라고 생각됩니다) 대표적으로 업계에서 어떤 프로그램을 선호하고 많이 사용하는지와 초보자가 배우고 사용하기 좋은 툴이 있을까요? 제가 이런 질문을 드리는 이유는 윅스나 워드프레스로는 데이터베이스에서 자료를 입력하고 출력한 데이터를 그래프하거나 표로 불러오는 페이지를 만드는게 안된다고 생각해서 입니다. 좀 심화적인 질문일수도 있다고 생각됩니다만 답변 부탁드립니다. 결론은 아래와 같은 느낌의 홈페이지를 만들어 보고 싶어서 입니다. 데이터를 가져오고 그려줌 : some.co.kr/analysis/youtube#none 슬라이더 컨트롤이나 직접 값 입력 계산해줌 maphe.github.io/e7-damage-calc/kr/index.html tapukoko.github.io/pokecalc/
과거엔 나모웹에디터, 드림위버 등을 써서 비주얼하게 작업을 하면, 알아서 html 소스가 자동 생성되는 방식을 쓰긴 했었는데요. 요즘은 다시금 완전 코딩방식으로 제작들을 합니다. 실시간 그래프나 이런 것들은 자바스크립트를 이용하면 되고 데이터는 ajax 방식으로 값을 받아와서 뿌려주면 됩니다.
@@sellerdogJAVAscript가 아니라 JavaScript 입니다. (대소문자 주의) 요즘은 JavaScript를 가지고 HTML DOM을 만들기도 하고 스타일링을 하기도 하는데 이런 걸 지원하는 걸로는 Vue(nuxt), React(next), Svelte(SvelteKit) 등이 있습니다. 그리고 ms가 만든 TypeScript라고해서 JavaScript 파생 언어도 있습니다.
Java앱과 javascript는 다른 언어입니다. javascript를 사용하기 위해서 따로 설치할 것은 없습니다. 브라우저 ( 크롬 등) 가 javascript 를 잘 처리해 줍니다. 링크를 공유한다는 게 무슨 말인지 정확히 알 수는 없으나, 제 맘대로 해석해서 답을 드리자면, 웹호스팅과 같은 외부 공간을 빌려서 작성한 html을 그곳에 업로드 하셔야 한다고 답변 드리겠습니다.
2:31 혹시 이렇게 깔끔히 브라우저를 확인하는 방법이 뭔지 아시나요ㅜㅜ 고라이브를 눌렀는데 영상들을 따라 똑같이 적었는데요.. 언어 모드도 html이고요ㅜㅜ 근데 제가 적은 이름들과는 다르게.. 다른 게 뜨고.. 파일 들어가는 곳이 뜨고..ㅜㅜ 하고는 싶은데.. 어캐 해여할지 모르겠어요옹😭😭 확인이..ㅜㅜ
비쥬얼스튜디오 프로그램 내에서 확장탭(ctrl+shift+X) 누르시고, 거기 검색창에다가 open in browser 검색하셔서 다운로드 받으세용! 되셨다면 html 문서 작성하신 후 단축키 alt+B 누르시면 작성된 브라우저가 바로 열립니당! (요거 물어보신거 맞으실랑가염ㅋㅋㅋㅋㅋ... 저도 비슷한 고민하다가 찾아낸거라 ㅋㅋㅋ)
크롬을 사용하지 않는 분들은 태그 내에 태그를 넣어야 한글이 제대로 출력됩니다. 이 부분은 느낌표 + Tab을 하였을 때 나오는 안의 태그들에 포함되어 있으니, 기본 템플릿 태그들을 그대로 내버려두고 작업을 하시는 것을 추천드릴게요.
@@user-ts3yd2fu1w ?
진짜 최고의 영상입니다.
잡설없이 빠르게 내용 진행되는게 너무 깔끔함.
JS 공부하기 전에 html 이 영상만 딱 보면 됨
와 ㅠㅠㅠ 진짜 너무 ㅠ쉬워요 선생님,,, 제가 한달 반 동안 배운 내용을 동영상 하나로,,, 최고에요 ㅠㅠㅠ 감사합니다,.,
HTML이 쉬운건지 아니면 아케이님이 잘 설명하는건지 해깔릴 정도로 HTML도 쉽고 설명도 좋네요
대단한 강의입니다
html을 전혀모르는 나에게도 큰 도움이 됩니다
감사합니다
영상이 몇개 없지만 생각보다 영상 퀄리티도 높고 핵심만 있네요! 앞으로 많은 영상 부탁 드려요!!!
너무 빨라서 어렵지만 정말 핵심만 들어있는거 같아요 이 배운내용으로 저만의 웹사이트 간단하게 만들어야겠네요.^^
물흐르듯 자연스러운 내레이션을 그리고 영상을 만드셨는지 감탄했습니다.
짧은 시간동안 핵심을 제대로 집어 주신 것 같습니다.
와... 다른영상 1시간보다 이영상 6번 보는게 저한테는 훨씬 좋을 것 같아요.
익힐떄까지 볼게요 감사합니다!
진짜 감사합니다. 덕분에 사이트를 만들수 있었고 Visual code studio에서도 잘 써먹고 있습니다. 진짜 정말로 도움을 많이 줬네요
바쁜 시간 쪼개셔서 귀한 영상 만들어 올려주시니 감사드립니다!
강의 감사합니다 현재 학점은행제로 C언어 HTML,CSS배우고있는데 좀 부족한 느낌이 듭니다. 선생님이 설명해주신 내용만 숙지해도 취업할 때 괜찮을까요? 아님 책을 사서 공부를 해야할까요?? 어떻게 공부해야할지 좀 막막하기도합니다. 도와주세요!
웹개발을 하신다면 C언어는 사실 평생 쓰실 일이 없으실거라 자바스크립트를 배우시는 걸 추천드리겠습니다.
깔끔한 설명 좋습니다! 앞으로도 좋은 영상 기대하겠습니다!
기본기가 탄탄한 설명 감사합니다~!
5:52 초 하나의 div 테그로 어떻게 묶나요?? 드레그를 해도 안되네요...
선생님 혹시 크롬으로 사이트를 미리 보기 하고 싶은데요🥺 윈도우에서는 컨트롤 알트 o를 누르면 연결이 되는걸로 아는데 맥북에서는 어떤걸 눌러야 연결이 되는지 아실까요..?🥺🥺 맥북m1 pro입니다..
핵심적인 내용만 쏙쏙 잘 설명해 주셔서 좋네요! 알고 있던 내용이지만 차근차근 다시 복습중입니다 :D
학원 샘보다 더 알아듣기 쉽게 귀에 쏙쏙 들어옴
갸꿀잼이누 ㅋㅋㅋ
영상 잘 만들어 주셔서 감사합니다!
오 설명이 귀에 쏙쏙 들어오고 소스? 보여주고 바로 적용된 화면 보여주셔서 이해가 잘되었습니다!! 감사합니다 :)
정리 스타일이 깔끔하고 좋네요! 나중에 CSS랑 자바스크립트도 해주세요!
2:33 비쥬얼 스튜디오 코드 브라우저에서 보는 방법은 어떻게 하나요??
간단하고 빨리익힐수있어요
태그 복습에 정말 도움이 많이 되었어요. 감사합니다^^
웹개발에 관심이 있어서 기초부터 배우고 싶은 저에게 많은 도움이 됐습니다 !
혹시 제가 작업한 html을 브라우저에서 확인하는건 어떻게 하는걸까요 ?
visual studio code를 깔았는데 OPEN EDITORS가 안보입니다.. 왜 안보이는걸까요 ㅠㅠㅠ
안녕하세요. 좋은 영상 감사합니다.
저는 과거에 2003년경인가요 HTML 을 처음 배우고 드림위버인가요? 그걸로 배웠던거 같습니다.
제 전공은 전자공학이라 HTML 을 제외하면 웹개발 관련 지식은 거의 없습니다.
요즘에는 홈페이지들을 보면 그래프나 차트등도 이용되고요. 데이터베이스와 연동되어 자료 입출력 되는걸 볼수 있는데요.
이런 페이지들을 쉽게 비주얼베이직 MFC 와 같이 HTML 소스를 직접입력하지 않고 그려가며 해주는 툴은 없을까요?
드림위버가 관련툴인거 같은데 능동적인 차트(실시간 데이터그리기) 와 같은 홈페이지도 만들수 있는지 궁금합니다.
그리고 드림위버, 나모웹에디터와 같은 툴들이 많은데요.(HTML 태그 입력하지않고 페이지 제작하는 프로그램이라고 생각됩니다)
대표적으로 업계에서 어떤 프로그램을 선호하고 많이 사용하는지와 초보자가 배우고 사용하기 좋은 툴이 있을까요?
제가 이런 질문을 드리는 이유는 윅스나 워드프레스로는 데이터베이스에서 자료를 입력하고 출력한 데이터를 그래프하거나 표로 불러오는 페이지를 만드는게 안된다고 생각해서 입니다.
좀 심화적인 질문일수도 있다고 생각됩니다만 답변 부탁드립니다.
결론은 아래와 같은 느낌의 홈페이지를 만들어 보고 싶어서 입니다.
데이터를 가져오고 그려줌 : some.co.kr/analysis/youtube#none
슬라이더 컨트롤이나 직접 값 입력 계산해줌
maphe.github.io/e7-damage-calc/kr/index.html
tapukoko.github.io/pokecalc/
과거엔 나모웹에디터, 드림위버 등을 써서 비주얼하게 작업을 하면, 알아서 html 소스가 자동 생성되는 방식을 쓰긴 했었는데요. 요즘은 다시금 완전 코딩방식으로 제작들을 합니다. 실시간 그래프나 이런 것들은 자바스크립트를 이용하면 되고 데이터는 ajax 방식으로 값을 받아와서 뿌려주면 됩니다.
@@kingchobo 답변 감사합니다. 요즘 HTML+CSS+JAVAscript 공부 중이에요. ajax 는 뭔지 봐봐야겠네요
질문 내용중에 데이터베이스에 자료를 넣거나 빼오는 것에 대한 질문이 있어서 추가로 답변드리겠습니다. 해당 부분은 파이썬, php, nods.js, 자바 등의 language 들 중 하나를 더 공부하셔야 합니다. 그런 백엔드쪽이 필요합니다.
@@sellerdogJAVAscript가 아니라 JavaScript 입니다. (대소문자 주의) 요즘은 JavaScript를 가지고 HTML DOM을 만들기도 하고 스타일링을 하기도 하는데 이런 걸 지원하는 걸로는 Vue(nuxt), React(next), Svelte(SvelteKit) 등이 있습니다. 그리고 ms가 만든 TypeScript라고해서 JavaScript 파생 언어도 있습니다.
감사합니다.
좋은 강의 감사합니다 :) 근데 혹시 8:45 에서 나온 걸 자세하게 설명 부탁드려도 될까요?-? Java앱을 깔아야 하는 건가요? 거기서 어떻게 하면 되고, 제가 만든 걸 링크나 이런걸로 공유하는 방법은 뭔가요?
Java앱과 javascript는 다른 언어입니다. javascript를 사용하기 위해서 따로 설치할 것은 없습니다.
브라우저 ( 크롬 등) 가 javascript 를 잘 처리해 줍니다.
링크를 공유한다는 게 무슨 말인지 정확히 알 수는 없으나,
제 맘대로 해석해서 답을 드리자면, 웹호스팅과 같은 외부 공간을 빌려서 작성한 html을 그곳에 업로드 하셔야 한다고 답변 드리겠습니다.
감사합니다 정말 큰 도움 받았습니다.
이제 막 코딩을 배우기 시작했는데요 ㅠㅠ혹시
Visual studio code 를 다운받고 연습을 하면 홈페이지 처럼 막 자기가 만든걸 볼 수 있잖아요 그건 혹시 돈이 드나요?ㅠㅠㅠ
아닙니다. 돈이 들지 않아요!
답변 감사드립니다 !!
유익한 정보 감사합니다!
감사합니다
간단해서 보기 좋습니다
좋은영상 감사해요
신기하당 사랑해요
m1 사용중인데, html 웹에서 확인하면 한국어가 외계어(?)로 나옵니다... 어떻게 해결해야하나요 😂
비쥬얼 스튜디오에서 작업하고 깃허브를 통해 올리고 들어가보면 계속 하얀화면만 뜨는데 이런 오류는 어떻게 수정할 수 있을까요?
제 예상으로는 commit 까지만 하시고 push를 하지 않으셔서 깃허브에 올라가지 않은 것 같습니다.
@@arkaycoding 헉 답변해주셔서 감사합니다 ㅠㅠ 다시 해보니까 제가 뭘 실수한거같네요 덕분에 해결했습니다!! 감사합니다
로그인 후 페이지 이동하는거는 html 말고 자바 스크립트로 해야하나요?
페이지 이동 자체는 html, 자바스크립트 다 가능한데,
로그인 후 페이지 이동은 자바 스크립트를 사용해야 한다고 보시면 됩니다.
와 진짜 사랑해요
감사합니당!!!
안녕하세요.. 완전 초보인데 작성한 html을 화면에서 확인하려면 무엇을 누르면 되나요 ? ㅠㅠ
작성한 파일을 더블클릭 하면 브라우저로 열립니다!
좀더 쉽게요.. 화면에 모든거 더블클릭해도 미리보기같은 화면 안나오는데 ㅠㅠ
파일탐색기에서 더블클릭하시면 됩니다.
Wow!! 설명 대박 잘하심
감사합니다
이런강의, 무료로? 감사하다~
2:31 혹시 이렇게 깔끔히 브라우저를 확인하는 방법이 뭔지 아시나요ㅜㅜ 고라이브를 눌렀는데 영상들을 따라 똑같이 적었는데요.. 언어 모드도 html이고요ㅜㅜ 근데 제가 적은 이름들과는 다르게.. 다른 게 뜨고.. 파일 들어가는 곳이 뜨고..ㅜㅜ 하고는 싶은데.. 어캐 해여할지 모르겠어요옹😭😭 확인이..ㅜㅜ
음 정확히 어떤 의미신지 잘 모르겠네요. 크롬 브라우저로 해당 html 파일을 열면 이렇게 됩니다.
비쥬얼스튜디오 프로그램 내에서 확장탭(ctrl+shift+X) 누르시고, 거기 검색창에다가 open in browser 검색하셔서 다운로드 받으세용! 되셨다면 html 문서 작성하신 후 단축키 alt+B 누르시면 작성된 브라우저가 바로 열립니당! (요거 물어보신거 맞으실랑가염ㅋㅋㅋㅋㅋ... 저도 비슷한 고민하다가 찾아낸거라 ㅋㅋㅋ)
이거 그냥 보여줘도 괜찮아요..? 구독..
6:03 에서 가로로 나뉘는것이 아니고 세로로 나뉘는데 어카죠..??
5:51 전체태그를 div태그로 묶을때 어떻게 한방에 오른쪽으로? 옮기는 건가요ㅠㅠ
드래그 후에 Tab을 누르시면 됩니다.
@@arkaycoding 빠른 답변 감사합니다!! 10분 길이 영상 1시간동안 잡고 해보고 있어요.. 많은 도움 되었습니다🥰
저도 헤매고있었는데 질문해주신것도 답변해주신것도 너무 감사합니다 ㅠ
저는 연습으로 영상에나온 그대로 따라썼는데 왜 안될까요...
어떤 부분이 안되시나요?
아무리 태그를 쓰고 고치고 바꿔도 웹사이트에 제가 쓴 글이 나오지않습니다.
태그를 고친 상태로 새로고침 해보셨나요?
오랫동안 소식이 없네요.. 무슨 일 있으신지 ㅠㅠ
8:51 @쓰라는 표시도 안뜨고 제출도 안되요 아무리봐도 문제가 없던데 뭐가 문제일까요 ㅠㅠ
저도 이게 안됩니다!
저는 visual studio 새로운폴더 가 안나오네요
굿
믿습니다..에이맨...
!탭을 누르면 이렇게 나온다는 것은 되는 사람에게나 해당되는 말이구요. 안되는 사람은 천번해도 않됩니다.
설정에서 emmet 을 검색하셔서 기능을 활성화 해 주시면 동작합니다.
선생님 혹시 브라우저로는 어떻게 확인이 가능할까요??😢
해당 html 파일을 탐색기 (맥은 Finder)에서 더블 클릭해서 확인 할 수 있습니다
@@arkaycoding 우와 선생님 ㅠㅠㅠ 칼답 감사합니다
북마크
8:35 submit
a택 alt 속성
table 7:00
떡상하세요!
혹시 비주얼 스튜디오에서 html을 실행하기 위해 별도로 설치해야하는 것들이 있을까요?
Html 실행 자체는 브라우저 (크롬) 으로 하는 것이라 따로 설치할 건 없습니다.
간단히 얘기하면 html 실행기가 chrome가 같은 브라우저 프로그램입니다.
혹시 같은과정을 지났는데 오픈브라우저에서 한글이 깨지는건 이유가 뭔가요?
익스플로러나 사파리 같은 구버전 브라우저를 사용하실 경우 head 태그 안에 를 넣어주어야만 한글을 인식합니다. 영상에서 설명드린 느낌표 + Tab을 했을 때 head 태그들을 그대로 남겨두세요!
@@arkaycoding 감사합니다!
브라우저는 어떻게 들어가요?
! TAB이 안되는대 어떻게해요
1:17 ‘!+tap’ 부터 막히네요 😢 왜 안될까요?
인텔리센스가 작동 안할 때는 수동으로 ! 후 Ctrl+space 해서 자동완성 탭을 띄워준 후에 엔터 눌러서 입력도 가능합니다
영상을 보는데 왜자꾸 하품이..ㅠㅠ
카암사 합니다앙~~
나는 왜 따라하는데 다 저렇게 안나오지
개꿀 핵심만 있음.
개념잡는게 너무 어렵습니다 ㅠㅠ
더..더해주세요
4:40 div 태그 생성후 줄바꿈 단축키가 어떻게 되는지 궁금해요
원하는 곳에 커서를 두고 alt 키 누른 상태에서 위 아래 버튼으로 이동시켜보세요.
Css도 간략하게 해주시면 안될까용?
css는 html 보다 방대합니다. 간단하게 사실 안됩니다. ^^
@@kingchobo 네 알겠습니다
왜 !탭 해도 저런게 안뜰까요...
파일을 컨트롤s로 html문서로저장하고해야됩ㄴ디ㅏ
6:35
6:04 이해못햇당
돌아와주새요 ㅜㅡㅜㅜㅠ
현생이 너무 바쁘네요.. ㅠㅠ
@@arkaycoding 인프런강의같은 것도 따로 안하시죠? ㅠㅠ??
네 따로 타 플랫폼에 영상을 제작해둔 건 아직 없습니다. 시청해주셔서 감사합니다. 부디 좋은 개발자로 거듭나시길 바라겠습니다.
여기가 진리네..다른 html강의들은 조회수 빨라고 개소리로 시간을 얼마나 처잡아먹는지.. 여기가 진짜다!!
wow wow wow wow wow wow
mnkjnkl
영상이 ㅈㄴ게 빨라서 듣기만 하셈 연습하려고 볼려면 딴 영상보든가해야함 계속 멈췄다 했다 멈췄다 했다 해야함 ㅋㅋ
피드백 감사합니다!
재생 속도를 낮추거나 되돌리기 하면 되는 걸 밥상 다 차려줬는데 떠먹여달라고 하네 ㅋㅋㅋㅋㅋ
6:30