ENG SUB) [JavaScript Basics&Application #1] Making Starcraft With JS?! (JQuery, Codepen, Bootstrap)
HTML-код
- Опубликовано: 30 июл 2019
- This video is a lecture that learns basic concepts and application areas of Javascript, and learns the most important concept, function, and makes it using Starcraft example.
Explaining functions to the magic of Harry Potter and learn about JQuery, JQuery UI, and how Javascript are used in Codepen and Bootstrap.
As you can see in the video, there are many functions that are already created. So even if you only know the basic concept of the function, you can implement a lot of functions just by writing it.
Image Download URL
Cloacking: drive.google.com/file/d/11Z8v...
Wraith: drive.google.com/file/d/1skeL...
Codepen has a lot of unique and colorful UI elements, but it has been uploaded by individual developers and needs a separate license check. Usually it follows the MIT license (free for commercial use) and no matter where you use it, it okay by just paste the license into your code with comments. However, certain works may have private licenses registered, so be sure to check them out!
Detail View - License
blog.codepen.io/legal/licensing
blog.codepen.io/documentation...
Bootstrap: getbootstrap.com
If you feel that this video is a little hard, please refer to my channel's HTML and CSS courses. If you still have difficulty, you can study the theory on the Javascript basic learning site and watch it again! Please leave a comment whenever you ask questions ~!
Recommended basic concept learning site
- Codecademy : www.codecademy.com/learn/intr...
* The code that was used for the live broadcast of 0.01 million subscriber lottery event was also based on Javascript and JQuery. After finishing the course [Javascript Basics and Utilization # 2] , I will upload the code description video.
![[JavaScript 기초와 활용 #2] API의 개념과 활용! 카카오 책 검색 기능 구현하기](http://i.ytimg.com/vi/QPEUU89AOg8/mqdefault.jpg)
![[JavaScript 기초와 활용 #2] API의 개념과 활용! 카카오 책 검색 기능 구현하기](/img/tr.png)
![SUB) [CSS Tutorial for Beginners and Advanced] Creating a Google Clone WebSite](http://i.ytimg.com/vi/_YrXKxY8PTY/mqdefault.jpg)
![ENG SUB)[HTML Basic Course Lecture 1] Anyone can hack a website immediately by watching this video](/img/1.gif)
진짜 감사합니다..! 매일 방송 챙겨보면서 공부할게요!
송주환 좋게 봐주셔서 감사합니다ㅎㅎ 더 쉽고 유익한 영상들 많이 올릴게요!
진짜 해외영상 보고 영어원문보면서 하는것보다 조코딩님 영상보는게 훨씬 시간절약되고 좋아요 항상 감사합니다
좋게 봐주셔서 감사합니다ㅎㅎ 더 유익한 영상들 많이 올릴게요!
설명을 쉽게 잘 해주셔서 코딩을 배워볼 엄두를 내봅니다.좋은 강의 감사합니다!
매번 문법기초만 몇번 봤는지….이렇게 예제로 배우니 이해가 더 쉽고 실무에서도 도움이 훨씬 많이 되네요. 실무, 예제 위주 강의 좋아요!!!구독하고 갑니다~~
정말 코딩을 이렇게 쉽게 설명해 주는 사람은 처음봅니다. 이런 사람이 진짜 천재 아닌가요?
감사합니다ㅎㅎ 천재가 아니여도 요즘은 코딩을 도와주는 도구들이 많이 나와서 누구나 쉽게 할 수 있는게 코딩입니다!
조코딩님... 정말 그냥 초보자들의 구세주라는 말 밖에 안나옵니다. 여러 튜토리얼 강의 봤찌만.. 조코딩님처럼 전체적인 그림을 이렇게 쉽게 그려주시고, 라이브러리가 뭔지도 알려주시는 분은 조코딩님이 처음입니다... 사실... 농담이 아니라... udemy나 이런데 강의 만드셔서 유료로 하시면 잘 될 것 같습니다. 앞으로도 조코딩님 강의 계속 보면서 열공하겠습니다. 감사합니다!!
과분한 칭찬 해주셔서 감사합니다ㅎㅎ 더 좋은 강의 만들 수 있도록 하겠습니다! 감사합니다~!
@@jocoding 넵 조코딩님 화이팅하세요!!
진짜 ... 너무 쉽게 잘 설명해주시는것같아요 제가 몇달동안 헤매고 개념도 애매하던 부분들이 이 동영상을 보면서 한번에 다잡혔어요..
ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ
진짜 사이다강의 ㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠ사랑합니다
ㅎㅎ 좋게 봐주셔서 감사합니다👍👍
짧은 시간에 전달을 잘 해주셔서 개념을 금방 잡을 수 있었네요. 좋은 강의 감사합니다.
좋게 봐주셔서 감사합니다!ㅎㅎ
진짜 구세주.. 너무너무 감사드려요..이렇게 쉽게 설명해주시다니 !! 구독!!좋아요!! :)
늘 유익한 정보 감사합니다~
저도 댓글 감사합니다 유관동님ㅎㅎ
그저께 우연히 채널을 처음 봤는데 너무 설명도 잘 해주시고 참고하기 편한 예제를 잘 만들어주셔요! 구독 좋아요 하고 갑니당 감사해요🥰🥰
구독 좋아요 감사합니다!ㅎㅎ 더 유익한 영상들 많이 올리겠습니다 :)
정말 유용한 정보들 감사해요ㅠㅠ 덕분에 많이 배워가고 공부 재밌게 하는것 같습니다!! 화이팅이에요
그렇게 말씀해주셔서 감사합니다ㅎㅎ 유Marcos님도 코딩 공부 화이팅입니다!
근데 진짜 설명 제일 쉽게 하시는거 같아요.
좋게 봐주셔서 감사합니다ㅎㅎ 더 쉽고 유익한 영상들 자주 올리겠습니다~!
[Javascript 기초와 활용 #1] 스타크래프트 만들기?!(feat. JQuery, Codepen, Bootstrap 등)
이번 영상은 Javascript의 기본 개념 및 활용 분야에 대해 배워보고 가장 중요한 개념인 함수를 배우고 이를 활용해 스타크래프트 예제를 만들어보는 강의입니다.
Javascript의 라이브러리인 JQuery, JQuery UI의 사용 방법 및 구글링 팁 등을 배워보고 지난 시간에도 활용해보았던 Codepen, Bootstrap에서의 Javascript 활용에 대해 살펴봅니다.
영상에 나왔듯 함수의 기본 개념만 알아도 이미 만들어진 함수들이 많아서 가져다 쓰는 것 만으로도 엄청 많은 기능을 구현할 수 있습니다.
실습 이미지 다운로드 주소
Cloacking: drive.google.com/file/d/11Z8vaFjJj0ihNHj02733UmfBZNCypn1r/view
Wraith: drive.google.com/file/d/1skeLoa9RU0A--Kx6XmI_xskNexL0rGF3/view
Codepen은 독특하고 화려한 UI요소들이 많지만 개인 개발자분들이 올려주신 것이라 별도의 라이센스 확인이 필요합니다. 보통 MIT라이센스(상업적 이용 무료)를 따르며 어떻게 쓰든 상관없이 주석으로 여러분의 코드에 라이센스만 붙여넣으시면 전혀 문제가 없습니다. 그러나 특정 작품은 Private 라이센스를 등록한 경우도 있으니 유의하여 꼭 확인해보세요!
Detail View > License 에서 확인 가능
라이센스 설명: blog.codepen.io/legal/licensing
라이센스 확인 방법: blog.codepen.io/documentation/views/details-view/
Bootstrap: getbootstrap.com
이번 영상이 조금 어렵게 느껴지시는 분들은 제 채널의 HTML, CSS 강좌를 참고해주시고 그래도 어렵다면 Javascript 기초 학습 사이트에서 이론 공부를 조금 하시고 다시 시청하시면 이해가 더 잘 되실겁니다! 질문사항은 언제든 댓글 남겨주세요~!
추천 기본 개념 학습 사이트
- Codecademy(미션) : www.codecademy.com/learn/introduction-to-javascript
- 생활코딩(영상) : opentutorials.org/course/743 , opentutorials.org/course/3085
*1만 구독자 기념 추첨 생방송에 사용되었던 코드도 Javascript, JQuery를 기반으로 작성되었습니다. Javascript를 모르시면 이해가 어려우실 수 있을 것 같아 [Javascript 기초와 활용 #2] 강좌 마무리 후 코드 설명 영상 올리도록 하겠습니다.
조코딩님 '라이센스 확인 방법' 링크를 클릭하면 애러창이 뜹니다. 확인 부탁드려요.
헉 지금봤네요ㅠ 이제 수정완료하였습니다
blog.codepen.io/documentation/views/details-view/
이론만 공부하다가 지쳐서 조코딩님 강의 보게되었어요. 유용한 강의 감사합니다🙏
감사합니다!ㅎㅎ
처음엔 호기심으로 본건데...이런저런정보알게되고
코딩까지.....ㅎㄷㄷㄷㄷ
잘봤어요..... 앞으로도 좋은 컨텐츠 많이 만들어 주세요. 구독 좋아요. Complete.
구독 좋아요 감사합니다ㅎㅎ 더 쉽고 유익하게 배우실 수 있는 컨텐츠 많이 올려드리겠습니다!
하나하나 잘 배우고 있습니다. 좋은 강의올려주셔서 감사합니다.
좋게 봐주셔서 감사드립니다!ㅎㅎ
좋은 강의 감사합니다. 이해하기 쉽게 잘 설명해 주시네요.
와 자바스크립트로 몇일동안 고생하고 있는데 너무 감사합니다...
도움이되셨다니 좋네요!ㅎㅎ 댓글 남겨주셔서 감사합니다
유용한 정보, 친절하고 쉬운 설명 감사합니다.
진심으로 웬만해선 이런 말까진 안 하지만 기타 다른 강의들 기본 문법만 즉 훑고 실전도 초보자들은 이해 못 할 용어들이랑 응용법으로 혼란만 야기하는 것과 달리 진짜 이거 하나 듣고 수개월간 헷갈렸던 모든 것들이 이해됐습니다. 이게 제대로 된 강의 같네요. 구독 누르고 갑니다. 알찬 영상 강의 계속 업로드 해주세요
오 좋게 봐주셔서 정말 감사합니다ㅎㅎ 더 유익한 강의 많이 올리겠습니다!
20분 강의 듣고 스타크래프트를 만들수 있게되었습니다!!? 강의 잘 봤습니다 ㅎㅎ
강의 너무너무 감사합니다. 코딩 초심자라 개념이 안잡혀서 힘들었는데... 조코딩님 강의 보고 나니깐 웹개발이란 이런거구나하는 큰 그림이 그려지네요. 감사합니다.
Maker JIN 좋게 봐주셔서 감사합니다ㅎㅎ 지금까지 프론트엔드 중심으로 강의를 만들었는데 곧 백엔드도 업로드 예정입니다! 또 보러와주세요~🙇🏻♂️🙇🏻♂️
좋은 정보 감사합니다. 다른 강의에서 소스를 무작정 따라 작성했는데요. 영상 보고 다시 소스를 보니 이해가 잘 되네요. :)
이해가 되셨다니 다행이군요!ㅎㅎ 혹시 모르는 것 있으면 언제든 댓글 남겨주세요~
정말 감사합니다 ㅠㅠㅠㅠ 다른것들도 많이 찾아봤는데 이해가 안가서 뭐지..??? 하고 계속 멍때리고있었는데 너무너무 도움이 많이되었어요 ㅠㅠㅠㅠㅠㅠ좋아요 구독 무조건 하고 갑니다!!
오 도움이 되셨다니 다행이네요!ㅎㅎ 좋아요 구독 감사드립니다 :)
조코딩님 강의 목소리가 쏙쏙들어오는데 자바스크립트에 대해 더 많은 강의 해주시면 더 많이 찾아볼게요ㅜㅜㅜ
강의너무 감사해요!
감사합니다! 현재 멋쟁이사자처럼과 함께 자바스크립트에 대한 상세한 강의를 준비중에 있습니다ㅎㅎ
정말 좋은 강의네요, 감사합니다.
좋게 봐주셔서 감사합니다 :)
인프런에서 무료 강의 커리큘럼 보고 쭉 따라오고 있어요! 단순 이론 강의만 듣는 것보다 간단한 실습을 하면서 하니까 훨씬 재미있오요 ㅎㅎ 그리고 단축키처럼 엄청 사소한 부분까지 알려주시니까 따라가기가 쉽네요~ 어제는 css 강의에서는 처음으로 강의를 똑같이 따라하지 않고 이것저것 넣어보며 문제를 해결했는데 박수 치면서 좋아했어요 ㅋㅋㅋ 감사합니다 선생님~~~ 쭉 따라가보겠습니다! 목표는 엄청 간단한 앱 만들어 보기예요!
오 코딩의 재미를 알아가고 계시군요!ㅎㅎ 응원합니다!!
조코딩님 ..설명을 너무 잘하셔서 배워보려는 용기가 생깁니다...
감사합니다ㅎㅎ 코딩 공부 응원합니다!
유익하게 잘봤습니다! 앞으로도 초보에게 쉽고 도움되는 강의 많이 부탁드립니다^^ 좋아요 구독!!
좋아요 구독 감사합니다ㅎㅎ
동양상 볼떄 마다 매번 감사함을 느낌니다..
좋게 봐주셔서 감사합니다!ㅎㅎ
2일 쉬다 처음부터 복습준비... 정말 설명 꿀 🍯
오오 좋게 봐주셔서 감사합니다!ㅎㅎ
잘 봤습니다!!! 문법을 배우는데 이걸 어떻게 사용하는건지 막막한 느낌이었는데 도움이 많이 되었습니다. 앞으로도 좋은 영상 많이 올려주세요 ㅠㅠㅠ
도움이 되셨다니 기쁘네요ㅎㅎ 영상 잘 봐주셔서 감사합니다! 더 좋은 영상 힘내서 많이 올리겠습니다:)
감사합니다 조코딩님 이번 강의도 재밌게 따라하면서 배웠습니다^^ 마지막에 jquery 기능인 페이딩하고 jquery ui 기능인 드래블 기능도 추가해서 해봤습니다 ㅎㅎ 이렇게 구글링 하는 습관이 익숙해지도록 많이 해봐야겠네요ㅠ 항상 감사합니다
와 응용력이 좋으시군요!ㅎㅎ 구글에 어마어마한 자료들이 있으니 뭐든 만드실 수 있으실겁니다 :)
조코딩 JoCoding 자바스트립트에 대해서 이렇게 직접 만들어보면서 더 배우고싶은데 배울만한 곳 좀 알 수 있을까요?
영상 감사히 봤습니다^^
저도 댓글 감사합니다^^
많은도움이 되네요.감사합니다.
도움이 되셨다니 좋네요ㅎㅎ 댓글 남겨주셔서 감사합니다~!
이번영상도 클리어하고갑니다 !!
클리어하시느라 고생하셨습니다! 감사합니다~
'생활코딩'을 통해 자바스크립트의 기본을 쭉배우고(훑고) 전 보다 더욱 복잡해진 생각과 머리를
'조코딩'님의 강의를 통해(실전에 적용해보기까지) 제 머리를 배열화 한듯이 깔끔히 정리 할 수 있었습니다.
찝찝함이 많이 사라졌습니다.
너무 감사합니다. 저의 소중한 시간을 save시켜주셔서.
이런 질 높은 코딩 유튜브강의를 무료로 20대에 맞이할 수 있어서 너무도 행복하고 큰 행운입니다.
오 정리가 되셨다니 다행입니다ㅎㅎ 앞으로도 더 유익한 영상 많이 올리겠습니다!
너무 유익하게 보고있읍니다~
감사합니다!
우선 하기 전에 hide()랑 show()부분에서 멈춰두고 혼자서 해 봤습니다. toggle()이 있는줄 모르고 계속 찾고 찾다가 toggle 방법이 있음을 찾아서 해결했습니다. 이후에 영상을 재생했더니 toggle 방법이 있다는 설명이 나오네요 ㅎㅎ.. 이게 코딩의 맛인가 싶습니다! 달달하네요 계속 열심히 하겠습니다 감사합니다 ㅎㅎ
오 코딩이 달달하게 느껴지신다면 크게 성공하실분 같네요!ㅎㅎ White Seal님의 코딩 공부 응원하겠습니다!
정말 쉽게 설명해주셔서 감사해요.
좋게 봐주셔서 감사합니다ㅎㅎ
웹개발 공부하다보니 배울 언어들이 너무너무 많아서 그 언어가 뭔지 알기도 전에 어렵다고 생각했었는데 이렇게 쉬운것들이였다니... 맨 땅에 헤딩하면서 한줄 한줄 코딩하다가 라이브러리 하나씩 알려주시니까 코딩이 더 재밋어져요!! 조코딩님 정말 감사해요 ㅠㅠㅠㅠ
그렇게 말씀해주셔서 감사합니다 Julie Kang님!ㅎㅎ 더 쉽고 유익한 영상들 많이 올릴게요!
너무 강습잘하시네요 시간만 들이면 수십만 찍으실듯 설명하는 톤도 엄청 매력적인강사이신듯
오 그렇게 좋게 봐주셔서 감사합니다ㅎㅎ
cs전공이었는데 자바 하다가 전과했지만 다시 시작해보려고 하는참에 조코딩님 채널 찾았네요! 자바나 파이썬 등등 강의 앞으로 열심히 보면서 배워보겠습니다 구독하고 갑니당
구독해주셔서 감사합니다ㅎㅎ 제 채널이 학습에 도움이 되셨으면 좋겠네요!
오우야... 잘보고있어요
저도 댓글 남겨주셔서 감사합니다 :)
좋은 강의 감사합니다!!
좋게 봐주셔서 감사합니다!ㅎㅎ
좋은정보 감사해요^^
저도 댓글 남겨주셔서 감사합니다ㅎ
아무것도 모르는 저에겐 아직 어렵고 무슨 말인지 잘 모르겠지만 ㅠㅠ 무작정 고대로 따라만해도 뭐가 작동이 되니까 너무 신기하고 재밌어요!! 그저 따라했을 뿐인데 ㅋㅋ "다 외우실 필요는 없고"라는 멘트에 한시름 놓기도 하구요 ㅋㅋㅋㅋㅋㅋ 궁금하긴한데 뭐부터 해야할지도 몰라서 진입장벽이 높다 생각했는데 조코딩님 덕분에 모르긴 몰라도 흥미도 더 생기고 진입장벽도 좀 낮아진 기분이에요. 좋은 영상 올려주셔서 정말 감사합니다 ㅠㅠ 추천해주신 생활코딩도 너무너무 좋아요. 왜 존경하신다고 했는지 알겠더라구요! 제가 유튜브 댓글을 정말 잘 안쓰는 편인데 처음 올리신 영상부터 하나씩 따라하다가 너무 좋아서 댓글 남겨요ㅠㅠ 덕분에 신세계를 알아가고 있어요.
오 장문의 댓글 남겨주셔서 감사드립니다ㅎㅎ 코딩은 생각보다 어렵지 않습니다! Ria님의 코딩 공부를 응원합니다 :)
정주행중.. 웹 공부가 너무 방대해서 손대기 어려웠는데 너무 쉽게 배우고있습니다..
오 정주행 감사합니다!ㅎㅎ
감사해요! 복습용으로도 너무너무 좋은 강의고 이해도 잘되요 ㅠㅠ 역시 오늘도 재미있는 강의! 2탄도 기대합니다.
그리고 질문이 두개정도있는데요! 시간 되시면 답변 부탁드리겠습니다 : )
필요하거나 궁금한것이 있을때 검색하면 되지만 그게 생각보다 제 마음대로 자료가 딱 하고 나타나지 않더라구요.
검색하는 법이 꽤 어려운것(?)같아요. 왜냐면 어떤효과나 내가 원하는걸 관련된 걸 검색하고 싶어도 단어를 모르기 때문일까요?
이건 역시나 많이 검색해보고 유튜브를 보며 터득해야되는걸지 궁금합니다.(질문1)
그리고 제이쿼리 복사해서 쓰면 된다고 하셨잖아요,
복사해서 쓰되 왜 그렇게 작동하게 되는지 뜯어보면서 제것으로 만들어야지 공부가 될까요?(질문2)
사실 처음부터 뜯어보고 만들려고하면 이해도 안되고 금방 지쳐버리게 되더라구요!
그리고 마지막 하나 더 여쭤보고싶은데요(죄송해요 ㅎㅎ;;)
jQuery 스크립트 파일 위에 hide and show 를 적용하니까 움직이지 않더라구여,
jquery 스크립트 파일 밑으로 쌓아나가야 하는건가여? 제이쿼리 스크립트 파일 적용을 한 후에
다음 함수들이 적용되서 그런건가여~?
좋게 봐주셔서 너무 감사합니다ㅎㅎ 다음 영상으로 더 유익한 컨텐츠로 또 올릴게요!
1. 검색 방법은 보통 (쓰고자 하는 언어,라이브러리) + (하고자하는 행위)로 검색하면 웬만한 것은 나오는데 많이 검색해볼 수록 찾는 실력도 늘어나는 것 같아요! 안 나올때는 검색어를 조금씩 바꾸어가며 다양하게 시도해보시면 나오실 겁니다. (ex hide가 안나오면 disappear 로 검색하는 등)
2. 어떻게 작동하는지 상세하게 공부한다면 더 좋겠지만 말씀대로 이해도 안되고 금방지치게 되니 우선 만드는 것도 좋은 것 같아요! 사실 그런식으로 많이 만들다보면 굳이 이해하려하지 않아도 '이런식으로 동작하는건가?' 라는 생각이 드는데 그 때 원리를 공부하게 되면 더 이해도 잘되고 좋더라구요!
3. 코드는 위에서 아래로 순서대로 실행하기 때문에 jQuery 라이브러리가 먼저 포함되어야 jQuery 관련 문법을 쓸 수 있습니다! 생각하시는 것이 맞습니다~!
햄과 햄스터 너무 웃겨서 빵터졌네요 ㅋㅋㅋ 유익한 정보 감사합니다!
이야 이 집 설명 맛집이구먼
감사합니다!
넘 재밌어요~짱~*
잘 배워서 저도 웹만들고 싶네요. 가능할지~동영상 열공 하겠습니다 ~
재미있게 봐주셔서 감사합니다ㅎㅎ 열공하시면 당연히 원하시는 웹 만드실 수 있습니다!
최고 멋쟁이~ 저도 하나 재밌는거 만들어서 보답하고 싶습니다!!
감사합니다ㅎㅎ 응원합니다!!
잘 배우고 있습니다 CK 모델 조코딩님:)
ㅋㅋㅋㅋ 감사합니다 :)
영상 보기전:코딩 어떻게함???
영상 보고나서:이제 자바스크립트로 뭐든 할 수 있을 것 같은 기분이 드는군...
현실의 나 : 이게 왜 안되지???
밑글 공감&진짜 조코딩님 비스코 형식 어떻게 하는지 몰라서 깔고 용량 낭비했는데 와 진짜 구세주 인정...ㄷㄷㄷ....
ㅎㅎ 감사합니다
간단한게 전체적인 맥락을 알려주셔소 고맙습니다
와우~ 조코딩님을 왜 이제야 알았나 싶네요.. 강좌 볼 게 너무 많아요~
강좌 목록을 지금은 좀 왔다갔다하면서 보고 있는데요.
보는 순서가 정리되면 좋겠어요 ^^
암튼, 좋은 강의들 감사합니다. 오늘도 배우고 갑니다.
ruclips.net/p/PLU9-uwewPMe19RQNzTdSdewSgw92UI1kl
감사합니다!ㅎㅎ 몰아보기를 순서대로 보시면 가장 적절하게 보실 수 있습니다 :)
@@jocoding 구독자도 어마어마한데, 매번 답글까지 달아주셔서 영광입니다. 정주행해 보겠습니다.
조코딩님 얼굴은 앳된데 팔털이.. 장난 아니시네욬ㅋㅋㅋㅋㅋ
감사합니다 기초강의부터 하나하나 넘어왔습니다. 혹시 더더욱 기초와 활용등을 넘어 심화 과정도 만들어 주실수 있으신가요?! 다른 분들이 만드신걸 보았지만 조코딩님께서 하신게 더 집중되고 공부하기 편하여서요!
항상 감사합니다!
좋게 봐주셔서 감사합니다!ㅎㅎ 심화 강의까지도 꾸준히 준비해보겠습니다!
조코딩님 저는 소프트웨어 전공이지만 조코딩님 영상을 보고 그동안 제가 놓쳐왔던 세세한 부분들을 짚어볼 수 있었습니다. 비전공자의 입장에서 설명하셔서 그런지 개념 하나하나를 정말 쉽게 잘 설명해주시네요 ㅎㅎ
하나 알려드릴 것이 있는데 "{ }" 이 기호는 "대괄호"가 아니라 "중괄호" 입니다. 대괄호는 "[ ]" 기호를 의미합니다.
앞으로도 좋은 영상 많이 부탁드립니다^^
감사합니다ㅎㅎ 앞으로 오류 주의하겠습니다ㅠ
유료강의에서 볼수있는 정말 짱인 강의
너무 감사합니다 열심히 연습하겠습니다
좋게 봐주셔서 감사합니다!ㅎㅎ 코딩 공부 화이팅입니다!
조코딩통해서 생활코딩수업듣고있는데, 생활코딩수업듣고 조코딩들은후에 예제들 얼른풀어보고싶네요ㅎㅎ
오 화이팅입니다!ㅎㅎ
진짜 등에 가려운 부위 있긴 있는데 어디인지 모르는데
조코딩님이 다 긁어주시네 이런분들이 강의를 하셔야 하는데 ㅠㅠ
오프라인 강의 뿐만 아니라 유튜브 강의 중에서도 제일 쉽고 머리에 쏙쏙 들어가게 강의해주십니다
조코딩님 다른 분들 언어 강의는 너무 이해가 힘든데 조코딩님이 한번 해주시면 안될까요?ㅠㅜ
저가 온천지 컴공학생들 다 광고할께요
제발 자주 영상 올려주세요
헛ㅋㅋ 좋은 말씀 너무 감사합니다. 힘이 많이 되네요! 올리고 싶은 것은 엄청 많지만 직장다니느라 준비시간이 짧아서 자주는 못올리고 있습니다ㅠㅠ 최대한 시간 많이 내볼게요!! 얼른 직장 관둘정도로 잘되면 좋겠네요ㅋㅋ
개념이 확! 잡히네요~^^
그렇게 봐주셔서 감사합니다ㅎㅎ
감사합니다
댓글 남겨주셔서 감사합니다~
1. 자바스크립트는 큰 따옴표(""), 직은 따옴표('') 구분 안해요.
2. 새미콜론(;)는 변수 선언, 함수 등등 끝에 붙이는건데 안붙여도 되요. 그런데 if (a == 1){} 이런식으로 한줄로 쓸때 그리고 중괄호 안에 여러가지 함수가 있을때는 함수 끝에 새미콜론(;)을 꼭 붙여줘야되요.
감사합니당 ^_^
김시현님 댓글 남겨주셔서 감사합니다 ^.^
10:50 스트라 크래프트 stra ㅋㅋㅋ 잘 보고 있어요
헉 오타 죄송합니다ㅠ 잘봐주셔서 감사합니다!ㅎㅎ
햄 햄스터 보다가 빵터졌네요 ㅋㅋ 재밌게 잘보고 있습니다.
재미있게 봐주셔서 감사합니다!ㅎㅎ
감사합니다.
후원 감사드립니다!!
댓글보고 설명쉽게하는것같에서 지금 보고있습니다
영상 봐주셔서 감사합니다ㅎㅎ
오늘도 역시 머리속에 쏙쏙 들어오는 명쾌한 강의 잘 봤습니다. 햄과 햄스터였군요. ㅎ 어차피 직접 코딩은 미친 짓인걸 알기에 최대한 이해만 하려고 노력중입니다.^^
이번 영상 내용이 많아서 어려울 수 있다고 생각했는데 쏙쏙 들어오셨다니 다행이네요ㅎㅎ
항상 좋게 봐주시고 댓글 남겨주셔서 감사합니다!
질문좀 할께요. 웹사이트를 반응형으로 만들면 만들고 나서 앱으로 등록하고 싶으면 등록 할 수 있는건가요?? 반응형이라는건 앱에서도 작동하니 싸이트를 만들고 나면 바로 등록이 되는건가요?? 요즘 만들어지는 웹사트는 다 반응형인가요?? 만약에 기능 중점 앱이 아니라 웹사이트 형식의 앱이라면 웹사이트 만들 듯이 만들어서 스토어에 등록하면 되는건가요?? 매일 공부라고 하고는 있는데 알면 알수록 햇갈리네요.
오픈 API는 개발자 등록만 하면 단 1의 숨겨진 제약 없이 키만 받아서 마음대로 써도 되는건가요?? 아니면 무료이미지들처럼 무료로 다운은 받되 상업적으로 쓸려면 출처를 명시해야된다던가 하는 식으로 뭔가 단 1이라도 제약이 있는건가요?? 오픈 Api가 제공되는 곳에 들어가서 읽어보면 무지 장황하게 쭈욱 설명해놨는데 도대체 제약이 없다는건지 제약은 아예 없지만 1 정도는 있다는 식으로 애매하게 늘어놔서 이걸 쓰라는건지 말라는건지 헷갈리는 설명들이 많네요.
혹시 메일주소좀 알려주실 수 있나요?? 채널 아무리 뒤져봐도 이메일이나 SNS 아무것도 안보이네요.
반응형 웹은 화면 크기에 맞게 보여지는 모습이 변화되는(HTML/CSS가 변화하는) 것일 뿐 앱은 아닙니다! 앱스토어에 올릴 수 있는 것은 html 파일이 아닌 apk 등 다른 앱 형태의 파일이여야 합니다.
그러나 반응형 웹이 있다면 처음부터 앱을 제작할 필요 없이 상당히 간단하게 웹뷰를 만들어 앱스토어에 올릴 수 있습니다. (쉽게 말해 HTML -> APK로 만드는 것이죠)
안드로이드 : jerryjerryjerry.tistory.com/72
아이폰 : zeddios.tistory.com/375
혹은 PhoneGap (phonegap.com/)이라는 서비스도 있는데 웹을 넣으면 하이브리드 App 형태로 제작해주는 서비스도 있습니다.
즉, 정리하자면 반응형 웹은 "웹"이고 앱스토에어 올릴 수 있는 "앱"은 따로 제작해야하며 웹이 이미 있다면 웹을 웹뷰 형태의 앱으로 쉽게 변형할 수 있습니다.
잘봤습니다(HTML 폼 : !+tab), img + tap(자동완성) , jQuery,
조코딩님 강의잘보고있습니다. 자바스크립트 독학을 하기위한 책을 추천받을수있을까요? html과 css 는 생활코딩으로 독학을하였습니다. 자바스크립트를 이제 공부해서 저도 홈페이지를 만들어보고싶습니다
좋게 봐주셔서 감사합니다ㅎㅎ 저는 개인적으로 책 보다는 강의 위주로 공부하는 것을 좋아해서 JavaScript도 생활코딩을 추천드립니다!
opentutorials.org/course/3085
제가 자바스크립트 오프라인 스터디를 할 때 썼던 책은 아래의 책인데 나쁘지는 않았지만 저는 책보다는 생활코딩으로 더 도움을 많이 받은 것 같아요!
book.naver.com/bookdb/book_detail.nhn?bid=11990519
조코딩님 영상 몰아보는중
오 감사합니다!ㅎㅎ
아주좋네요!근데 css효과 좀더 넣거나 jQuery라이브러리써서 명도차이를 줬다면 정말 클로킹처럼 보였을거같아요ㅎㅎ
제이쿼리는 그만 놔줍시당....
@@IlllIlIlllIIIllIl ㅋㅋ영상이 제이쿼리내용이었으니깐요. 저도 리액트와 뷰파입니다~~ES6이상시대인데
해리포터에서도 마법을 만들수 있다구욧!!!!!!
헉 그렇군요! 제가 잘 몰랐네요ㅠ 해리포터에서는 어떻게 만드는거죠?
안녕하세요 영상 잘보고있습니당
혹시 영상과 더불어 볼
코딩관련 책 추천받을수있을까요?
뭐가 좋을지 모르겠네요
죄송합니다ㅠㅠ 저는 인터넷 강의, 학습사이트, 구글링으로 주로 공부해서 추천드릴 정도로 깊이 본 책이없네요ㅠ 학습 사이트도 괜찮으시다면 추천드리겠습니다.
배울 수 있는 곳이 정말 많지만 저는 아래 사이트들을 추천드리고 싶습니다.
1. 생활코딩 : 한글로된 영상으로 차근차근 기초부터 배우고 싶으시다면 "생활코딩" 강의를 추천드립니다. 강사님이 설명을 정말 잘해주시고 모든 강의가 무료입니다.
HTML: opentutorials.org/course/3084
CSS: opentutorials.org/course/3086
Javascript: opentutorials.org/course/3085
2. CodeCademy : 영어로 되어있긴 하지만 개념 정리와 함께 미션을 통해 바로 실습을 하며 익힐 수 있어서 빠르게 배울 수 있습니다. 이것도 일부 기능을 제외하고 HTML CSS의 개념은 무료입니다.
HTML: www.codecademy.com/learn/learn-html
CSS: www.codecademy.com/learn/learn-css
천천히 개념을 하나하나 배우고 싶으시다면 생활코딩 강의를 추천드리며, 빠르게 코딩에 활용할 목적이시면 CodeCademy를 추천드립니다. 물론 둘 다 듣는것도 좋습니다!
HTML, CSS, JS등 프론트 엔드 기술을 학습하신 후에는 프레임워크를 활용하여 웹을 개발해보시는 것을 추천드립니다. 추천 사이트로는
1. 인프런 : 다양한 강좌들이 있으며 한글 강의로만 되어있습니다. 유료도 있지만 무료 강의도 많이 있어 부담없이 배우기 좋습니다.
www.inflearn.com/
2. udemy : 영어에 어느 정도 자신이 있으시다면 추천해 드리는 사이트입니다. 전 세계에서 정말 많은 사람이 코딩을 배우는 플랫폼이며 잘 가르쳐주시는 강사님들이 많습니다. 다양한 유료 및 무료 강의가 많이 있습니다. 유료 강의 구매 시 주의 사항으로는 세일을 안하는 날이 더 적을 정도로 세일을 많이 하니 꼭 세일기간을 활용하여 유료강의를 구매하시는 것을 추천드립니다.
www.udemy.com/
강의 잘 들었습니다! 궁금한것이 있는데 javascript코드를 Head태그사이에 넣는 것보다 body태그의 끝나는부분에 넣는것에 특별한 이유가 있나요?
좋은 질문이십니다! 코드는 위에서 아래로 순서대로 로딩이 되는데 javascript에서 다루는 HTML이 로딩되기도 전에 실행이되면 안되니 body 끝에 넣는 것이에요!
진짜 감사합니다 !!!
공부할 때 유튜브 영상(유튜브에 올라온 전체 영상들 자바, 파이썬, html, javascript등등)을 먼저 한 번 다 보고 생활코딩이나 다른 사이트에서 복습하는게 좋을까요?
아니면 유튜브 영샹과 맞춰서 그때 그때 영상을 보고 생활코딩에서 복습하는게 나을까요?
저도 댓글 남겨주셔서 감사합니다ㅎㅎ
시작 전에 한번 보고 감을 잡은 후 내용을 다 배우고 다시보면 새롭게 보이실 것 같아요!
조코딩 JoCoding 감사합니다 !!
조코딩 화이팅~
정말 좋은 강의 감사합니다~ 구독 좋아요를 강의도중에 팝업으로 띄워서 바로 눌렀습니다
덕분에 코딩이 정말 쉬워졌어요!!
그런데 궁금한게 있는데요, 난독화된 js일경우 복호화를 할려면 document.write나 alert을 쓰면된다고 하던데...
그래도 복호화가 안되는 부분이 있으면 실행결과값만 볼수 있는 함수가 있을까요?
좋게 봐주셔서 정말 감사합니다ㅎㅎ 난독화 관련해서는 말씀하신 것 처럼 alert, document.write를 이용하는 방법이 있고 난독화 해제 사이트도 있으며 브라우저 자체에서도 볼 수 있습니다!
1. alert(key변수);
2.document.write(key변수);
3.document.write(“”+key변수+””);
4.document.write(“”+key변수+””);
출처: kwangguevara.tistory.com/10
JS 복호화 사이트: www.strictly-software.com/unpack-javascript
브라우저 자체 기능 이용 :kthan.tistory.com/entry/%ED%95%B4%ED%82%B9%EB%AC%B8%EC%A0%9C%ED%92%80%EC%9D%B4-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EB%82%9C%EB%8F%85%ED%99%94-Javascript-Obfuscation-%EB%90%9C-%EC%BD%94%EB%93%9C-%EB%B3%B5%ED%98%B8%ED%99%94-WOWHACKER-level6
대박.. 정말 감사합니다!!!
제가 원했던 답변 주셔서 정말 감사합니다
적어주신 내용은 돈주고도 못사는건데
이렇게 쿨하게 알려주셔서 감사합니다!
와 F12 눌렀을 때 나타나는구나.... 그것도 모르고 버그인 줄 알았네ㅋㅋ
조코딩님 스타크래프트와는 관련이 없는건데 .. 뜬금없지만 한가지 질문이 있는데요. .. 제가 배너 슬라이드를 만드는데 bxslider 라이브러리를 쓰고 있어요. 근데 슬라이드 transition이 발생되고 있을때 next버튼이나 prev버튼이 안먹히게 하려면 어떻게 해야 되나요? 슬라이드가 움직이고 있을때 next버튼이나 prev버튼을 2번 따닥 누르면 1번 슬라이드 이미지에서 3번 슬라이드 이미지로 한번에 이동이 되는데 이걸 막고 싶습니다. 물어볼 사람도 없고 검색해봐도 도저히 모르겠어서 뜬금없지만 질문 드립니다.. 감사합니다 조코딩님.
흠.. 저는 해당 라이브러리를 쓴적이 없어저 잘 모르겠지만 여기 옵션중에 그런 기능이 제공될 수도 있겠네요!
bxslider.com/options/
아니라면 따로 코드를 작성하여 대상이 onchange 이벤트 시 next, prev 버튼을 비활성화 하는 방법도 있겠습니다.
사랑해유ㅠㅠ
4:25
??? : 잇츠 레비오우사 낫 레비오사
ㅋㅋㅋㅋㅋ
ㅋㅋㅋㅋㅋㅋㅋ
어헠엌ㅋㅋㅋ20분! 😆👏👏
ㅎㅎ 길지만 유용한 내용이 많으니 학습에 참고해주세요~!
넹 ㅋㅋ
학원을 다니는 이유가 문법은 독학으로 할수잇는데, 이런문법과 사용법을 익혀서 대체 어디에 어떻게 써먹는지가 궁금해서 다니는거에요.
어떤 프로젝트로 예를들어주시면 학원다닐 필요가없어요..
딱 궁금했던거 다 말해주네....
궁금했던 내용이 있으셨다니 좋네요ㅎㅎ 댓글 남겨주셔서 감사합니다!
@@jocoding 일단 흥미 있게 알려주셔서 좋아요 코딩 첨 접해봐서 개념도 몰랐고 자바랑 자바스크립트 가 스타랑 스타브루드워 정도 차이인가 싶었고 웹페이지 만들어지는것도 신기하고 본업하면서 쨤쨤이 보면서 해보는데 재미나네요
학원차리셔도 될듯
질문있어요~ 비주얼스튜디오 실행하고 !+tab 치면 자동완성될때
조코딩님 영상에서 보여지는 메타값이랑 제꺼랑 좀 다른데요? 저는 메타값중에 http-equiv="x-ua-compatible" 항목하고 content="ie=edge" 항목이 자동생성 안되는데요
왜 그런건지 혹시 아시나요? 그리고 그 메타값은 가능하면 포함시키는게 좋기때문에자동생성된다고 생각되는데.. 크게 중요하지 않은건가요?
브라우저 버전에 따른 호완성 보기와 관련한 메타 태그인데 최신 브라우저를 이용하는 것이라면 크게 중요하지 않습니다! 자세한 사항은 아래 문서를 참고해주세요~!
webdir.tistory.com/38
@@jocoding 너무 감사합니다! ^^ 코로나 조심하십시요~~~!!!
자바스크립트로 모바일앱 다룬 영상도 있나요? 저 어플을 만들고 싶어서 안드로이드 스튜디오랑 자바언어를 최근에 죄금 공부했는데 안드로이드스튜디오에서 자바스크립트 언어로도 짤수있는건가요 아님 아예 다른 프로그램 써서 만들어야하는건가요?
ruclips.net/video/8eIQNfPbRms/видео.html
자바스크립트 언어로 위와 같이 react native 앱을 만들 수 있습니다!
자바스크립트로 만든 웹게임을 앱게임으로 가능할까요? 어제는 CSS로 만든 웹페이지를 앱으로 만든 것을 봤습니다.
영상을 보면러 점점 할 수 있겠다라는 생각이 있어서 실행력을 높이고자 물어봅니다. ㅎㅎ
가능하겠죠???
※ 저는 화학전공 정말 비전공자라서 조코딩님과 같은 이유, 창업에 관심만 가지고 코딩공부를 검색하다가 조코딩님을 알게되었습니다.
Leader UrbanVoiceHub 네 가능합니다!ㅎㅎ 웹을 만드셨으면 쉽게 웹 뷰 앱의 형태로 바꿀 수 있습니다. 아래 앱 만들기 관련 영상을 참고해주세요!
ruclips.net/video/GyXLa-0R_S0/видео.html
Document
이렇게하고 html과 사진파일 같은 폴더에 넣어뒀는데 실행하니까 흰색창만 뜨네요...
뭐가 문제일까요... 몇시간쨰 고민중이고 구글링도 해보는데 답이 없습니다
흠.. 이상하군요 이미지의 이름은 cloaking.png, wraith.png가 맞나요? 흰색 창에 alt 글씨 표시는 안되시나요?
아마 확장자 숨김이 되어있어서 html 파일이 아닐 수도 있으니
[파일 탐색기] > [보기] > [파일 확장자명] 을 체크가 되어있는지도 확인해보세요!
검색창에 특정 검색어를 치면 글자가 나오게 할수 있을까요?
도저히 방법을 모르겠어서 물어봅니다.
조코딩님 너무 잘 보고 있습니다 잘가르쳐주셔서 감사합니다.. 저는 퍼블리셔로 일하고 있는데요..!! 제이쿼리로 웬만한 효과는 구현하고 있습니다만 자바스크립트는 배운적도 없고 너무 어렵고 잘 모르는데 이대로 괜찮을까요,,,, 아무래도 제이쿼리만으로 구현이 어려운 것도 있고 사람마다 회사마다 퍼블리싱과 개발의 기준이 모호하기도 해서 자바스크립트를 배워야할지 조언 구해봅니다 ㅜㅜ
아무래도 많은 것을 커버할 수 있는 개발자가 결국에는 더 잘 살아남을 수 있으니 JS는 꼭 공부해보시길 추천드립니다. 인터렉티브한 웹이 많기 때문에 JS를 활용할 일이 많을 수 있고 JS를 해놓으면 프론트엔드 개발도 어느정도 커버할 수 있어서 추후 커리어를 확장하는데도 도움이 되실 것 같습니다.
하하하 코딩 무식자 열심히 보고 갑니다
java와 javascript는 차이가 엄청나죠. 근데 java가 들어간 이유가 java만큼 간단하고 편리하고 유용하다라는 뜻에서 쓰인 것으로 알고 있습니다.
나무위키에 따르면 java의 유명세에 따라가려고 이름을 그렇게 지었다고 합니다ㅋㅋ
첫 탄생은 브랜든 아이크가 10일만에 설계한 것으로부터 시작한다. 처음에는 Mocha라는 이름이었지만 4달 만에 LiveScript라는 이름으로 개명하고 다시 3달 후에는 JavaScript라는 이름이 되어 오늘날까지 이어지고 있다. Java와 구문이 유사하기도 하고 해서 이름을 JavaScript로 명명했다...는 표면상의 이유고 그 속은 Java의 유명세를 타서 묻어가려고 의도적으로 만든 것이다.[3]
영상을보다가 저작권 유의하세요 라글을 봤는데 어떤점에서 유의하라는건지 모르겠어요 ~
저코드를 복사해서 자기 웹이나 앱을만들때 걸리는게 있는건가요 ?
ruclips.net/video/OI3fZJHQF8Y/видео.html
위 영상 중반쯤에 좀 더 상세한 설명이 있습니다! 법적인 문제가 없으려면 명시된 저작권 내용에 따라야합니다.