Search

반응형

'자바스크립트'에 해당되는 글 38건

  1. 2021.08.08 [왕초보]자바스크립트(JavaScript) 시작에 앞서...
  2. 2021.03.01 [ jQuery/javascript]jQuery 기본 사용법에 대해 알아봅니다. 1
반응형

안녕하세요. 신기한 연구소입니다.

2월부터 투입되었던 프로젝트 철수를 눈앞에 앞두고 있는데

말년 병장같은 기분으로 출근을 하고 있습니다. (으흐흐)

얼른 인수인계를 마치고 떠나고 싶네요..ㅋㅋ

다음 프로젝트에 대해 생각하지는 않고 여름휴가도 좀 챙기고

술 한잔 하면서 스크립트를 다시 공부해야겠다는 생각을 하게 되었네요.

 

지금도 웹스퀘어(Web Square)라는 상용툴을 사용 중인데

내부는 자바스크립트(JavaScript)로 만들어진 프레임워크인 듯합니다.

개인적으로 상용 툴을 별로 좋아하지는 않지만(지원 등등 문제로)

현실적으로 프로젝트를 너무 가려서 하기는 힘들기에.. 그냥 받아들인답니다.

짬밥이라고 하나요?

처음이 어렵지. 몇 번 하다 보면 다 비슷비슷하답니다.

여러분들도 처음이라 그런 거예요.

사실 학원에서 배워서 실전에서 바로 투입 후 개발을 잘하기는 힘들 겁니다.

저 또한 그랬던 시간이 있었거든요. ㅎㅎ

 

최근까지 X-Flatfrom이라는 툴을 장기간 사용했기에

발전해가는 자바스크립트를 접할 기회가 없었답니다.

예전 두꺼운 자바스크립트(javascript) 책으로 독학하면서 

열심히 코딩했던 기억이 나네요.

그 책을 다시 보려고 했지만 이제 오래된 책이 되었기에

새로운 책을 찾아 도서관에 방문해서 몇 권 대출해왔습니다.

사실 다양한 프로그래밍 관련 책들이 계속 나오고 있지만

비슷하거나 개인적으로 맘에 들지 않은 경우가 종종 있기에

도서관에서 (그래도 나름 최신판으로 나옵니다) 먼저 대출해서

쭉 읽어보고 난 뒤 맘에 들면 구매를 하고 있답니다.

책을 빌려오고 읽으면서 스마트폰을 잠시 열었는데...

어떻게 알았는지 유튜브에서도 코딩 열풍에 관한 영상들이 나오기 시작하더군요.

그래서 관심을 갖고 영상들을 봤는데

요즘 코딩 학원도 다니고 취업을 위해 고생하는 친구들이 많더군요.

저 또한 학원도 다녀보고 독학도 해보고 그렇게 취업을 해서

20년 넘게 IT 개발을 하고

다양한 언어와 툴 (Delphi, VB, PB, C/C++, JavsScrip, Ajax, jQuery, ProC, Java 등등)

을 사용하면서 시중에 나온 책과 현실과의 차이를 많이 느끼기도 했습니다.

 

처음 SQL을 학원에서 배웠을 때

책 보고 내용은 이해했지만..

그래서 뭘? 어떻게? 어디서? 실전에 사용하는지 전혀 알 수 없었고

답답했던 기억이 나네요.

새로 시작하는 여러분들도 분명 그런 답답하고 힘든 마음이 있을 거라 생각됩니다.

 

새로 시작하는 마음으로 정리도 하고

정말 최대한 개 쉽게 재미있게 포스팅을 해보려고 합니다.

 

또한 실전에서 프로젝트를 하면서 필요한 부분들을 

기억을 더듬어 대왕초보도 이해할 수 있도록

준비해보려고 합니다.

 

직장 생활하고 프로젝트를 진행하다 보면 공부할 시간이 많지는 않지만

비전공으로 이 세계의 생활에 동참하고 싶은 친구들에게

조금이나마 같이 공감하는 장소가 되었으면 하네요.

다들 조금은 여유를 가지고 같이 자바스크립트(JavaScript)

왕초보-> 실전의 길로 가보도록 해용~~~

 

빨리 가서 책 봐야겠습니다.

반응형
반응형

안녕하세요. 신기한 연구소입니다.

오랜만에 프로젝트에 투입되었는데 jQuery를 사용하네요. ㅎㅎ

사용한 지 오래되어서 기억이 가물거립니다.

복습도 할 겸 포스팅을 해봅니다.

사실 일하면서 보려고 쓰는 겁니다. ㅎㅎ

최근에 딥러닝(deep learning) 공부를 하고 있었답니다.

누군가 그러더군요.

개발자가 딥러닝을 왜 공부하냐고. 

개발자는 라이브러리 사용법만 익혀서 적절히 사용하면 된다면서

굳이 수학적으로 분석하고 공부할 이유가 없다고 하더군요.

jQuery도 같은 맥락이 아닐까 싶네요.

복잡한 자바스크립트(javascript)를 이리저리 테스트하고 사용하면서 시간낭비를 하는 것보단

jQuery 라이브러리로 간단하게 해결하면 효율적이라는 겁니다.

자바스크립트(javascript)로 길게 코딩할 필요 없이 간단히 jQuery 라이브러리로 정리한다면

그나마 칼퇴근에 도움이 되지 않을까 싶네요. ㅎㅎ

그렇다고 자바스크립트(javascript)를 무시하면 안 된답니다.

jQuery도 자바스크립트로 만들었거든요.

 

우선 jQuery를 사용하려면 해당 js 파일을 다운로드하여야 합니다.

https://jquery.com/download/

 

Download jQuery | jQuery

link Downloading jQuery Compressed and uncompressed copies of jQuery files are available. The uncompressed file is best used during development or debugging; the compressed file saves bandwidth and improves performance in production. You can also download

jquery.com

production과 development가 있는데

용량을 가볍게 하고 jQuery라이브러리를 수정하지 않고 사용만 한다면

production으로 다운로드하면 되고

jQuery 라이브러리 소스를 수정하거나 분석이 필요하다면

development로 다운받으면 됩니다.

오른쪽 클릭 후 다운로드하면 됩니다.

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html>
    <head>
        <title>tiBoyTest</title>        
        <script src="js/jquery-3.5.1.js"></script>
    </head>
    <body>
        <div id="test1">Test jQuery</div>
        
        <script>
            $(document).ready(function(){
                alert('hi');
            });
        </script>
    </body>
</html> 
cs

 

js 폴더에 jquery-3.5.1.js를 다운로드했습니다.

그리고 $()를 사용하고 있습니다.

원래 jQuery()로 사용하는데 더 간단하게 표현하고 위해 단축으로 $를 사용하고 있답니다.

$(document).ready(function(){

이 구문을 해석하면 html파일이 실행되면

DOM(Document Object Model, 문서객체모델)을 호출하는 부분이 $(document)입니다.

.ready는 DOM의 속성으로 준비, 즉 화면이 로딩되는 시점의 준비를 의미합니다.

그리고 function()을 사용해서 구현을 하면 됩니다.

 

그럼 간단하게 사용하는 방법을 살펴볼게요.

우선 <div> 처럼 요소를 선택해서 명령을 전달할 수 있습니다.

$("div").hide();

두 번째로 CSS에서 사용하는 class 값을 사용할 수 있습니다.

<div class="d01">

$(".d01").hide();

주의할 점은 클래스 값을 사용하는 경우는 반드시 .을 붙여서 사용합니다.

마지막으로 id를 사용하는 방법이 있습니다.

특정 부분에 대해 명령을 하고 싶을 때 사용하면 유용합니다.

<div id="d_01" class="d01">

$("#d_01").hide();

주의할 점은 id를 사용할 때는 반드시 #을 붙여서 사용해야 합니다.

이렇게 요소는 이름 그대로 사용하고,

클래스 값은 .을 붙여서 사용하며,

id는 #을 붙여서 구분할 수 있답니다.

이제 기본적으로 요소를 선택하는 방법을 알았으니

다양한 메서드(함수)를 사용하는 방법에 대해 준비해보겠습니다.

아래 하트(공감) 버튼을 눌러서 더 다양한 글을 쓸 수 있게 응원 부탁드립니다. 감사합니다.

 

반응형

'Software > jQuery' 카테고리의 다른 글

[jQuery/javascript]$와 $()에 대한 이야기. 제이쿼리  (0) 2023.06.19