본문 바로가기
반응형

분류 전체보기395

[인프런 inflearn] 리액트 + 파이어베이스 9버전 강의 후기, 프로젝트 결과물!(구경해죠...🤗🤩) 강의이름이 많이 길어요 너네 백엔드 하고 싶은 거 있으면 얼마든지 해 난 괜찮어 왜냐면 나는 파이어베이스가 있어 파이어베이스.... 실무에서 쓰지도 않을거구,,, 정말 포폴용으로만 사용할거여서..... 왠만해서는 혼자 공부하고 싶었지만ㅠㅠㅠㅠㅠ 야근 지옥으로 시간이 너무 모자랐거든요.😶😶 빠른 파이어베이스 학습을 위해서 돈주고 시간을 샀습니다. https://www.inflearn.com/course/%EC%A0%9C%EC%BD%94%EB%B2%A0-%ED%8C%8C%EC%9D%B4%EC%96%B4%EB%B2%A0%EC%9D%B4%EC%8A%A4/dashboard 너네 백엔드 하고 싶은 거 있으면 얼마든지 해 난 괜찮어 왜냐면 나는 파이어베이스가 있어 - 인 프론트엔드 개발자인데 로그인 기능을 구현하지 .. 2022. 12. 17.
[코딩애플]React 강의 솔직 후기, 프로젝트 결과물!😀 저는 이 강의를 html 강의 -> js 기초강의까지 마친 후 1차 수강했구요 it 회사를 다니고 6개월정도 지난 후에 2차 수강했습니다. 1차 수강때는 코딩에 대한 이해가 많이 부족해서 따라치기에만 급급했어요 강의 중간중간 내주시는 숙제는 건들어볼 생각도 못하고 복습없기 듣기만 했습니당 2차 수강때는 그래도 코딩짬바가 늘어서 중간중간 숙제들도 풀고 작동 원리도 찾아보면서 듣게 되더라구요 학습 내용은 강의 페이지에 다 적혀있습니당!! 코딩애플 강의 특징은! 위에 적혀있는 내용들 외에도 꿀팁들을 많이 알려주신다는 점입니다. 또한 음.... 어려운 문법들을 쉽게쉽게 설명해주시죠??? 코딩애플 들어보신 분들은 99퍼 공감하실듯?? 근데 사실... 코딩애플님 강의의 가장 큰 특징은 정답을 전부 다 알려주지 않는.. 2022. 11. 13.
[JavaScript] 오늘 날짜 + 현재 시간 출력하기_new Date() 코드 /** * 오늘 날짜 + 시간 출력하는 함수 * dateFormat: 날짜 포매팅 기호 (/,-,. 같은거) * timeFormat: 시간 포매팅 기호 (/,-,. 같은거) */ function GetCurDayTime(dateFormat,timeFormat) { return this.TimeString(dateFormat,timeFormat,new Date()); } function TimeString (dateFormat='/',timeFormat=':',date) { let year = date.getFullYear(); let month = date.getMonth() + 1; // 1월=0,12월=11이므로 1 더함 let day = date.getDate(); let hour = date.. 2022. 10. 30.
[JavaScript] 오늘 날짜 출력하기, 원하는 날짜 출력하기_new Date() 코드 /** * 오늘 날짜 출력하는 함수 * format: 포매팅 기호 (/,-,. 같은거) * addMonth: 월 더하기 * addDay: 일 더하기 * addYear: 년 더하기 */ function today(format='',addMonth=0,addDay=0,addYear=0){ let date = new Date(); let year = date.getFullYear(); let month = date.getMonth() let day = date.getDate(); if(addMonth!=0){date.setMonth((date.getMonth()+addMonth))}; if(addDay!=0){date.setDate((date.getDate()+addDay))}; if(year!=0){d.. 2022. 10. 29.
[React] Google fonts icons 사용하기 프로젝트를 진행하다보면 icons 들을 사용할 일이 많은데 font awesome 은 유료버전이 너므 많아서 다시 구글 아이콘으로 회기했습니다🙄 https://fonts.google.com/icons Material Symbols and Icons - Google Fonts Material Symbols are our newest icons consolidating over 2,500 glyphs in a single font file with a wide range of design variants. fonts.google.com google font 나 google icons 들은 html 기준이여서 React 에서 사용하려면 다른 방법을 사용해야 됩니당 1. 페이지마다 import 시켜서 사용하기 .. 2022. 10. 23.
[jQuery, JavaScript]클릭이벤트 정리(addEventListener,querySelector) jQuery Click Click 1. id 값으로 $('#btn_plus').on('click',() => { // 원하는 코드 }) 2. class 값으로 $('.btn_plus').on('click',() => { // 원하는 코드 }) 3. onClick 메소드 사용 let 플러스함수 = () => { // 원하는 코드 } 바닐라 JS Click Click 1. id 값으로 document.getElementById("btn_plus").addEventListener('click', () => { // 원하는 코드 }); 2. class 값으로 let className = document.getElementsByClassName("btn_plus"); // for 문으로 for (leti = 0;.. 2022. 8. 29.
[JavaScript] Class 로 생성자 Constructor 만들기_ 생성자를 상속받아서 생성자 만들 때, extends 편 (2) 생성자가 생성자를 상속받을 수도 있습니다. 엄마토끼 생성자입니다. class 엄마토끼 { constructor(이름){ this.first = '김' this.last = 이름; } } 이제 이 엄마토끼 생성자를 상속받는 아가토끼 생성자를 만들어볼게요 엄마토끼 생성자를 상속받은 아가토끼 생성자입니다. class 아가토끼 extends 엄마토끼 { constructor(이름, a = 0){ super(이름); // super 를 꼭해줘야됨 이거는 엄마토끼의 constructor 임 this.키 = 150+a; } } 자세히 보면 여기 extends 랑 super 라는 키워드가 보입니다. extends 는 말 그대로 상속받을 대상이 엄마토끼입니다~ 라는 뜻이규여 super 는 엄마토끼의 constructor.. 2022. 8. 14.
[JavaScript] Class 로 생성자 Constructor 만들기_ 상속편 (1) 생성자 아시나요? 다른 컴퓨터 언어에도 있는 생성자요 자바스크립트로도 생성자를 만들 수 있답니당 자바스크립트의 생성자로는 Object 를 찍어낼 수 있어요ㅎㅎ ES6 Class vs 구버전 생성자 // ES6 버전 생성자 class 생성자 { constructor(){ //여기다 이제 this. 어쩌구 쓰면 됨 } } // 구버전 생성자 function 생성자(){ //여기다 이제 this. 어쩌구 쓰면 됨 } 구버전 function(){}으로 생성자를 구현하는거와 조금 다르게 생겼지만 this 키워드를 쓰는거랑 파라미터를 사용하는 거는 완전 똑같습니당 ES6 Class 생성자 class 엄마토끼 { constructor(이름,키=0,무게=0){ this.first = '김'; this.name = 이름.. 2022. 8. 13.
[JavaScript] 파라미터에 = 넣기 _ default parameter 로 NaN 오류 해결ㄱ 제가 얼마전에 냈던 실수중에 하나인데여 db 에 있는 날짜 개수만큼 행 개수를 늘려주는 함수를 만들어놨는데 안늘어나는겁니다. 왜그런지 로그 찍어봤더니 NAN 이라고 뜨더라구여 그래서 왜 NAN 이라고 뜨는지를 봤더니 글쎄 제가 파라미터에다가 값을 안넣고 있었지 뭐에여 (시뻘겋게 오류메세지라도 뜨던가...js 왕시러 😥) NaN function 함수1 (a){ console.log(a+1); } 함수1(); 이거 오류 날까여 안날까여 안나여 근데 NaN 이라고 나왔어요 NaN 은 Not a Number 라는 오류인데여 숫자형식이 다른형식이랑 연산되었을 때 나오는 오류입니당 짠 function 함수1 (a){ console.log( (a === undefined ? 0 : a)+1 ); } 함수1(); 파라.. 2022. 8. 12.
[JavaScript] rest parameter_똑같은 ... 이지만 spread parameter 랑 달라여🤨 (파라미터로 들어온 변수들을 배열에 넣기) rest parameter ? 제가요 파라미터로 들어온 변수들을 배열에 넣고 싶어요 어떻게 코드를 짜야 할까요?? function 함수(...파라미터){ console.log(파라미터); } 이렇게 하면 됩니당 호출해보면 이렇게 배열에 잘 담겨서 나오죠 자세히보면 ... [JavaScript] arguments 의 뜻, 어떻게 쓰고 왜쓰는지.. (+인자랑 파라미터 차이) arguments? arguments 라는 칭구가 있습니당 함수 안에 파라미터로 들어온 인자들을 배열로 감싸주눈 애에요 (배열은아님) 근데 예전문법이여서 요즘 안쓰는듯 let 함수= (a,b,c) => { // 파라미터는 함수 gallery-k.tistory.com 제가 파라미터 맨 앞에거 두개만 빼고 배열에 담고 싶어영 function.. 2022. 8. 11.
[JavaScript] arguments 의 뜻, 어떻게 쓰고 왜쓰는지.. (+인자랑 파라미터 차이) arguments? arguments 라는 칭구가 있습니당 함수 안에 파라미터로 들어온 인자들을 배열로 감싸주눈 애에요 (배열은아님) 근데 예전문법이여서 요즘 안쓰는듯 let 함수= (a,b,c) => { // 2022. 8. 10.
[JavaScript] Spread Operator가 모임? 어따씀??(함수 파라미터로 배열 넣을 때 씀😕) (3) https://gallery-k.tistory.com/361 https://gallery-k.tistory.com/360 Spread Operator 어따씀?? Spread Operator 는 함수 파리미터로 넣을 수도 있습니다. 왜냐면 Spread Operator 는 배열을 흐트려주기 때문입니당... 3. 배열을 함수 파라미터로 넣을 때 함수 하나를 만들었습니다. 간지나게 arrow function 으로 만들었어영 함수 = (a, b, c) => { console.log(a + b + c); } 이제 이 함수에 파라미터를 넣어줄건데, 배열을 넣어줄겁니다. 함수 파라미터로 배열을 넣어주는 방법은 구버전 .apply() 를 제외하면 두가지입니당 (더있을수도!🙄) // [10,20,30] 을 넣을려면?? l.. 2022. 8. 9.
[JavaScript] Spread Operator가 모임? 어따씀??(Deep Copy 깊은복사 + 배열 object 덮어쓸때씀😮) (2) https://gallery-k.tistory.com/360 Spread Operator 어따씀? Spread Operator 는 참조타입 칭구들(배열이랑 object) 깊은 복사를 할 때 씁니다. 1. 배열 합치기 2. object 합치기 + 값 중복되면 덮어씌워짐 1. 배열 합치기 let 배열1 = [1,2,3]; let 배열2 = [4,5]; 여기 두 배열이 있눈데여 두 가지 방법으로 깊은 복사를 해보겠습니다. let 배열3 = [...배열1]; // == 배열1 deep copy let 배열4 = [...배열1,...배열2]; // == 배열1 + 배열2 deep copy console.log("배열3: ", 배열3); console.log("배열4: ",배열4); array.push() 와 같은.. 2022. 8. 8.
[JavaScript] Spread Operator가 모임? 뭐하는애임?(1) 저는 서버에서 넘어온 데이터들 (object 로 넘어와용) 깊은복사 얕은복사 할 때 Spread Operator 썼거든요... 전 글에서 복사 관련된 글을 쓰면서 느꼈는데... 정확히 얘가 뭔지 잘 모르고 무지성으로 사용했던거 같아서 정리좀 해보려구요🤔 Spread Operator? 그래서 Spread Operator 가 뭐냐면 직역해보세요 흩뿌려지는 연산자죠 조각조각 쪼개서 흐트러놓는겁니당 Spread Operator 하는일 1. array 를 흐트러놓음 2. string 을 흐트러놓음 1. array 를 흐트러놓음 let 배열 = ['토끼', '버니']; console.log(배열); console.log(...배열); 배열에다가 ...을 붙이고 출력을 하면 배열 안의 값들이 밖으로 나와서 strin.. 2022. 8. 7.
[JavaScript] 얕은복사, 깊은복사 Shallow Copy, Deep Copy_ 배열, object 복사하기(... Spread Operator, Json parse, stringify) 변수 값 복사 보통 string, number 담는 변수 값 복사할 때 어떻게 합니까 let a = '1'; let b = a; console.log(a); console.log(b); 이렇게 하죠 일반 변수는 = 등호로 값을 복사해놓으면 찐 값이 복사됩니당 let a = '1'; let b = a; // a 값 바꿔도 b 값에 영향을 안준다. a = '3' console.log(a); console.log(b); 중간에 원본 a 값을 바꿔도 b 에는 영향이 없어용 배열, 오브젝트 복사 자바스크립트에는 배열, 오브젝트 이런 애들이 있어요.. reference type 인데 변수 여러개 담아놓을 때 사용하는 애들이에요 근데 배열 오브젝트 이런애들은 그냥 = 로 복사하면 안됩니당 왜냐면여 (주소값이 복사되기.. 2022. 8. 6.
반응형