티스토리

똥멍충이
검색하기

블로그 홈

똥멍충이

rosepw.tistory.com/m

테스p 님의 블로그입니다.

구독자
0
방명록 방문하기

주요 글 목록

  • 매개변수, 인수 function a(parameter){ console.log(parameter); } a('argument'); 짝지어진게 없으면 인수는 언디파인드로 리턴해줌 function(x,y){ return x+y; } add(5,3); 8리턴 요로코롬 더해서도 가눙합니데이 퀴즈 매개변수 3개받아서 곲한값을 반환하는 멀티플라이 함수만들어보기 단 화살표함수로 const multiply = (x,y,z) => { return x * y * z; } console.log(multiply(2,3,4)); 근데화살표는 중괄호 다음리턴나오면 생략가능 그래서 const f = (x, y, z) => x * y * z; (a,b) => a+b; 간단한거할때 화살표함수많이쓴다고함 원래는 (a,b) => { return a+b;.. 공감수 0 댓글수 0 2022. 12. 22.
  • return function a(){} undefined a(); undefined 함수를 선언할때 undefined가 나오는 것은 신경ㄴ ㄴ a를 호출할때 a();결과값이 Undefined에 주목, 함수를 호출하면 항상 결과값이 나오는데 기본값으로 언디파인드 나옴 이값을 반환값이라고 하는데 반환값을 return으로 직접 정할 수 있음 returnㄱ쓰면 종료됨 다음꺼 실행안됨 리턴을 여러개쓰고싶으면 배열로 받으면됨 return [1,5]이런시긍로 공감수 0 댓글수 0 2022. 12. 22.
  • function function(){} or () => {} function a(){ } a(); // call 공감수 0 댓글수 0 2022. 12. 22.
  • 배열 배열안에 배열도 넣을 수 있꼬, length ㅅㅏ용하면 길이도 알 수 있고, 배열은 0부터 시작하는것도 알고 있쥬~! 팁 : 길이에서 -1 넣으면 마지막요소 찾는거 예 const el = ['a','b','c'] console.log(el[el.length - 1]); //무줘꽌 마지막요소 찾기 마너일 퀴즈 마지막 배열에서 2번째요소 (el[el.length - 2])v 배열 추가하기 const target = ['a','b','c']; target[3] = 'f'; console.log(target); 배열이 길이가 바뀔수가 있어서 마지막에 추가하고싶은경우 const target = ['a','b','c']; target[target.length] = 'f'; console.log(target); le.. 공감수 0 댓글수 0 2022. 12. 21.
  • break문 continue문 let i = 0; while (true){ if(i === 5) break; i++; } console.log(i); break하는순간 실행안됨 다음줄 실행안됨 그래서 break tip 무한반복문일경우 while을 많이쓰공, while에 break없으면 이상하고그릉거 알제? continue let i = 0; while(i < 10 ){ //홀수만 콘솔로그 i++; if(i % 2 === 0 ){ //짝수만 continue; //건너뛰기 } console.log(i); } 반복문에서 특정 조건에서만 실행되기를 원할때 사용하는거 그래서 컨티뉴 넣으면 이후 코드는 건너뛰게됨 %(나머지) 그래서 해석하면 i가 2로 나눈애가 0인애들은 스킵해랑(짝수라고 적어주어) 공감수 0 댓글수 0 2022. 12. 21.
  • for for(시작 1; 조건식 2; 종료식 4){ 동작 3 } ! 숫자는 작동하는 순서 적은거임 ㅇㅋ? 녜 for(let i = 0; i 공감수 0 댓글수 0 2022. 12. 21.
  • 조건부 연산자 || 삼항 연산자 기본형식 조건식 ? 참일때 실행되는 식 : 거짓일때 실행되는 식 3덩어리 파악하면 쉬웁니다..^^ 그래서 벨류에 넣을 수 ㅇ있음 let val = 5 < 0 ? 'ture' : 'false'; console.log(val); //flase if문으로 바꾸면? let val = 5 < 0 ? 'ture' : 'false'; console.log(val); //flase if(5 공감수 0 댓글수 0 2022. 12. 19.
  • if, switch 중첩 If문 let first = true; let second = false; if(first) { console.log('첫번째 조건 충족'); if(second){ console.log('두번째 조건 충족'); }else{ console.log('두번째 조건 불충족'); } } else{ console.log('첫번째 조건 불충족'); }; 하지만 이렇게 중첩을 계속 하다보면 콜백지옥에 빠질 수 있다. let first = true; let second = false; if(first && second) { //first 와 second 모두 true console.log('첫번째 조건 충족'); console.log('두번째 조건 충족'); }else if(first){ console.log('첫.. 공감수 0 댓글수 0 2022. 12. 19.
  • 연산자 연산자 우선순위 조심해야함 2+3*4; 14나옴알젱? 녜 true>false; ture 왜냐하면 Ture = 1 false=0 'b' > 'a'; true b가 a보다 문자 번호가 큼 b는 98 a는 97 규칙은 사전순임b가 a보다 뒤에나와서 b가더 크다 'abc' 문자열 abc를 숫자로 바꾸면 낫어넘버, NaN과 비교는 flase이므로 결과값이 flase '0' 딱보기에 같은데 같지않다라고 해서 자료형까지 비교하려면 !==로 해야함(정확하게) 공감수 0 댓글수 0 2022. 12. 13.
  • 숫자 NaN = not a number but this is typeof Number 공감수 0 댓글수 0 2022. 12. 13.
  • 문자열 값(value)은 프로그램이 조작할 수 있는 데이터를 의미, 값에는 여러 가지 종류가 있으며 값의 종류를 자료형(data type)이라고 함 - 문자열 '', "", `` 안에 감싸주는거 알젱? 녜 -typeof '문자열' -> string 반환 알젱 넹 - ''공백도 문자열로 됨 전부 - /n 스트링안에 넣으면 줄바꿈됨 알쥬 공감수 0 댓글수 0 2022. 12. 13.
  • Checkbox custom https://www.codingfactory.net/10710 CSS / 체크박스 꾸미는 방법 체크박스 꾸미는 방법 체크박스를 바로 꾸미는 건 어렵습니다. 그래서 체크박스와 연결된 라벨(label)을 만들고 라벨을 꾸밉니다. 라벨을 클릭하면 체크박스가 체크되고, 다시 클릭하면 체크가 www.codingfactory.net https://urliveblogger.blogspot.com/2021/01/css-checkbox.html 공감수 0 댓글수 0 2022. 9. 20.
  • 워드프레스 메뉴 커스터마이징 https://www.youtube.com/watch?v=lgIW_2QO87o 이해쉬움 ->참고사이트 : https://developer.wordpress.org/reference/functions/wp_nav_menu/ WordPress Developer Resources | Official WordPress Developer Resources Official WordPress developer resources including a code reference, handbooks (for APIs, plugin and theme development, block editor), and more. developer.wordpress.org 공감수 0 댓글수 0 2022. 9. 15.
  • Gasp 1 - 시작하기 1. https://greensock.com/docs/v3/Installation Docs Documentation for GreenSock Animation Platform (GSAP) greensock.com 2. 아래스크롤내리면 Cdn 편하니께 하고싶은 플러그인 추가해서 스크립트 카피 3. 하지만 나는 배우는 과정임으로 스크롤 트리거는 나중에하는걸로하자^^ 4. 스크립트 추가후에 gsap.to(".square",{ //time duration:2, //x위치값 x:500, //bg-color backgroundColor: "#6495ed", //bg-radius borderRadius: "50%", //border border:"5px solid white", // ease:"back" - 쭉 가다.. 공감수 0 댓글수 0 2022. 9. 5.
  • 제이쿼리 모바일만 적용하고 싶을때 jquery if browser width is less than 구글링 하면 https://stackoverflow.com/questions/7715124/do-something-if-screen-width-is-less-than-960-px Do something if screen width is less than 960 px How can I make jQuery do something if my screen width is less than 960 pixels? The code below always fires the 2nd alert, regardless of my window size: if (screen.width < 960) { alert('Les... stackoverflow.com 나옴 공감수 0 댓글수 0 2022. 8. 31.
  • 인자값 https://www.youtube.com/watch?v=jvtuRD48_C0&t=378s 공감수 0 댓글수 0 2022. 8. 31.
  • returns https://www.youtube.com/watch?v=6MzCHO8M3Uc 공감수 0 댓글수 0 2022. 8. 31.
  • Favicon 가지고 있던 풋터로고로 favicon로 적용해달라는 요청을 받았다. https://realfavicongenerator.net/ Favicon Generator for perfect icons on all browsers The ultimate favicon generator. Design your icons platform per platform and make them look great everywhere. Including in Google results pages. realfavicongenerator.net 여기 사이트에서 이미 업로드하고 정사각형으로~! 2. 적용된거 미리보기 페이지에서 아래쭉내리믄 클릭 3. 링크카피해서 헤드안에 넣고, 4. 팩키지 다운받아서 5. root directory.. 공감수 0 댓글수 0 2022. 8. 22.
  • Image lazyload(with lazysizes) 이미지가 너무커서 호스팅에 옮길때 환장하게 느린경우가 발생했다. 오늘 배운 이미지 로딩중에 사이즈 줄여버리기 https://github.com/aFarkas/lazysizes GitHub - aFarkas/lazysizes: High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, that detects any visibility changes triggered through user interaction, .. 공감수 0 댓글수 0 2022. 8. 16.
  • sass 터미널로 설치 1. 터미널 열어서 2. cd + 사스설치원하는 폴더 드래그 + 엔터 3. 아래코드입력후 엔터 npm install -g sass 4. 원하는 폴더지정해서 확인하기 예를들어 나는 src안에있는app을 css로 변환해서 저기 public/assets안에다가 넣고싶다면 sass src/app.scss public/assets/app.css 이걸 입력하면 자동으로app.css와 css.map 생성 5. 그리고 이렇게 하이픈 --두개를 넣어주면 자동와칭해서 sass에서 입력후 저장하면 자동 css저장됨 sass --watch src/app.scss public/assets/app.css 하지만 min이 없음 sass --watch 파일명.scss:압축할파일명.min.css --style compressed 이.. 공감수 0 댓글수 0 2022. 8. 8.
  • 4. 영어해석 They have studied together all their lives. They study all the usual school subjects, like maths, science, history and geography, but they can choose what they want to do each week. 그들은 공부를 해왔었다. 같이 그들이 사는동안, 그들은 공부하다 평범한 학교 수업들을, 수학이나, 과학, 역사 그리고 지오그레피? 하지만 그들은 할 수 있다 선택 그들이 원하는것을 2주마다. 그들은 같이 사는동안 공부해왔습니다. 그들은 학교에서 배우는 수업들 수학, 과학, 역사, 지오그래픽 들 2주마다 그들이 원하는대로 선택해서 들을 수 있습니다. ->그들은 평생을 함께 공부했습니다... 공감수 0 댓글수 0 2022. 6. 29.
  • 메뉴라인 정렬에대한 문제 footer 메뉴에 하나 더 추가해달라그랬는데 라인정렬이 바르지 못한걸 알 수 있다. 확인해보니 그지같은 float 때문이였다. 내가 생각했던 방법은 1. footer를 감싸는 전체 박스에 flex후에 저기 리스트만 flex, flex-wrap을해서 정렬을 맞추는 방법 문제점 : 문장이 길면 짧은제목들은 공백이 많이 생긴다는 단점이 있었다. 2. 각각 한문단씩 나눠서 두개의 메뉴로 구성해서 각각 추가할 수 있도록 만드는 방법 문제점 : 큰제목이 없어서 left right로 나눠서 서브로 메뉴들이 들어가게해볼까 생각도 했는데 많은 일을 해야할거같았다. 결론 : 사수의 도움을 받다. var lis = $(".js-menu-list > li"); for(var i = 0; i < lis.length; i+=5.. 공감수 0 댓글수 0 2022. 6. 24.
  • 라이브서버에서는 조심조심또조심 쇼피파이 새로운 페이지를 추가해달라그래서 디자인을 확인해보니 about page와 비슷해서 복붙을 오지게했더니만 아니나다를까 어바웃페이지도 같이 변경되는 불상사가 발생했다. 잊지말자...라이브서버+코드재사용시 쇼피파이는 항상 더블체크 공감수 0 댓글수 0 2022. 6. 24.
  • 자바스크립트 ClassList classList const div = document.createElement('div'); // the div class name is foo div.className = 'foo'; // our starting state: console.log(div.outerHTML); 1. div을 만들고, 그 클래스 이름은 foo로 하겠당! classList : remove(지울클라스명) div.classList.remove("foo"); // console.log(div.outerHTML); 그럼 클라스가 사라진걸 콘솔을 통해서 확인할 수 있다. classList : add(추가할 클래스 이름) div.classList.add("anotherclass"); // console.log(div.outerHTML.. 공감수 0 댓글수 0 2022. 6. 21.
  • craft cms 튜토리얼 https://craftquest.io/courses/craft-cms-3-tutorials Up and Running with Craft CMS 3 This course covers the basics you need to know when getting started with Craft CMS 3. Learn how to install Craft, how to configure a site in the Control Panel, best practices for templates, the basics of using Twig, and how to use special fields like Matri craftquest.io craft cms setup 구글에 검색하면 더 자세한 설치방법 나옴 공감수 0 댓글수 0 2022. 6. 15.
  • Carft cms 설치하기 https://www.youtube.com/watch?v=iC9DN0c8NQc&list=PLCy7dPypkr2rOlj9Ps5HbzYeJecL48yg-&index=8&ab_channel=CraftQuest 영상보고 정리한거임 훗날의 나를 위해.. https://getcomposer.org/ Composer A Dependency Manager for PHP Latest: 2.3.7 (changelog) Getting Started Download Documentation Browse Packages Issues GitHub getcomposer.org 1.다운로드클릭 php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');" php .. 공감수 0 댓글수 0 2022. 6. 15.
  • 점검 현재수준 HTML - html다룰 수 있지만 박스는 여전히 조금? 헷갈리는거같다. - 태그를 작성할때 가끔 헷갈리는 부분이있다. span으로 해야하나 p로 해야하나? - 재사용가능한 코드를 만들때 이름짓기가 너무 어렵기도하고 헷갈린다 이름이 너무 길어지거나, 중간에 추가할때 곤란해진다 개선하기위한 노력 1. 주기적으로 적당한 태그 사용법에 대해 찾아본다. 2. 이름 규칙에 대해 찾아보고 정확하게 이해, 적용해본다. CSS - 아직도 인풋박스, 셀렉트는 어렵게 느껴진다. 실제로 구현은 해봤지만 폼작성후 어디로 연결하는지 이런건 잘 모른다. - Position 반응형때면 매순간 위치값을 줄 수 없다는걸,,, 포지션 잠깐 쓰다보면 많이 써버린다는 점 - flex를 정복한줄 알았는데 쓰다보면 엥? 이렇게도 된다.. 공감수 0 댓글수 0 2022. 6. 10.
  • 잊지말자 이미지가 클 때 https://tinypng.com/ TinyPNG – Compress WebP, PNG and JPEG images intelligently Make your website faster and save bandwidth. TinyPNG optimizes your WebP, PNG and JPEG images by 50-80% while preserving full transparency! tinypng.com 공감수 0 댓글수 0 2022. 4. 7.
  • Craft CMS ImageOptimize 1. ImageOptimize 플러그인에서 다운받고 2. fields 에서 새로운 Optimized Images이름 ImageOptimize필드종류 이걸로 선택하기 세팅후 코드에추가하기 {% if solution.heroImage|length %} {% set optimizedImages = solution.heroImage.one().optimisedImages %} 예시임 공감수 0 댓글수 0 2022. 4. 7.
  • Craft CMS Share social link 1. 구글에 검색 social share link generator 2. 사이트보이는거 클릭 3. 나는 https://www.websiteplanet.com/webtools/sharelink/ 이사이트를 골랐다. 4. 원하는 사이트 넣고 어디에쉐어할건지 고른 후 버튼 클릭 5. 여기까지만 복사한다. 6. 코드에 추가하기 tw 공감수 0 댓글수 0 2022. 4. 5.
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.