언어 108

[제로초 Next.js] 패러렐 라우트, 인터셉팅 라우트

패러렐 라우트(Parallel Route) Parellel은 병렬이라는 의미를 가지고 있음. 즉, Parallel Route는 병렬 라우트로 해석할 수 있고, 병렬 라우팅을 사용하면 동일한 레이아웃에서 하나 이상의 페이지를 동시에 또는 조건부로 렌더링 할 수 있음. 병렬 라우팅을 이용하면 경로가 독립적으로 스트리밍될 때, 각 경로에 대해 독립적인 오류 및 로드 상태를 정의할 수 있음. ✔️ 구현하고자 하는 것 트위터 로그인 화면에서 로그인을 누르면 i/flow/login/page.tsx가 모달 형식으로 띄워지는 화면 📌 기존 모달과의 차이점 기존 모달과의 차이점은 주소가 바뀌냐 안 바뀌느냐이 차이다. 패러렐 라우트는 동시에 띄워진 페이지의 주소가 각각 다르고, 기존 모달은 주소 변경 없이 모달이 동작한다..

언어/Next.js 2024.03.26

[코딩자율학습] 16일차 구조체

구조체란 #include int main(void) { char* name = "나도게임"; int year = 2022; int price = 50; char* company = "나도회사"; char* name2 = "너도게임"; int year2 = 2022; int price2 = 100; char* company2 = "너도회사"; return 0; } 정보를 하나로 관리하면 좋을 때 구조체 를 사용. //형식 struct 구초제명 { 자료형1 변수명1; 자료형2 변수명2; 자료형3 변수명3; ... }; struct GameInfo { char* name; int year; int price; char* company; }; GameInfo 의 변수들은 각각 GameInfo 구조체를 구성하는 ..

언어/C 2024.03.25

[자바스크립트 딥다이브] 프로그래밍, 자바스크립트란?

자바스크립트를 제대로 공부하려면 꼭 봐야한다는 자바스크립트 딥다이브.. 두께가 어마어마해서 스터디를 구해 들어갔지만 스터디장이 날랐다. 그치 인생은 마이웨이니까 일단 시작! 1장 프로그래밍 프로그래밍이란? 컴퓨터에게 실행을 요구하는 일종의 커뮤니케이션 0과 1밖에 알지 못하는 기계가 실행할 수 있을 정도로 정확하고 상세하게 요구사항을 설명하는 작업이며, 그 결과물은 코드 문제 해결 방안을 고려할 때 컴퓨터의 입장에서 문제를 바라봐야 한다. (컴퓨팅 사고) 예) 사람: 소리를 키워라 > 컴퓨터: 소리를 60으로 키워라 프로그래밍 언어 - 컴퓨터가 쓰는 말(기계어)는 너무 어렵다. 그래서 사람이 이해할 수 있도록 번역기(컴파일러 or 인터프리터)를 돌려서 보여주는 것. - 구문과 의미의 조합으로 표현된다. ..

언어/JavaScript 2024.03.25

[코딩자율학습] 15일차 동물카드 뒤집기 프로젝트

#include #include // 헤더 파일 추가 #include // 헤더 파일 추가 // 전역변수 int arrayAnimal[4][5]; //카드 배열 선언, 카드 20장인 2차원 배열 선언 char* strAnimal[10]; //카드에 표시할 동물 이름 배열 (동물 이름 10개) int checkAnimal[4][5]; //카드 뒷면, 앞면 확인 배열 선언 // 함수 선언 void initAnimalArray(); //카드 배열 초기화 함수, 게임을 시작하면 카드는 모두 뒷면, 배열의 모든 요소에 같은 값을 넣음. void initAnimalName(); //동물 이름 배열 초기화 void shuffleAnimal(); //카드 섞기 함수 선언 int getEmptyPosition(); //..

언어/C 2024.03.24

[코딩자율학습] 14일차 다차원 배열

다차원 배열이란? 1차원 배열 int i; int arr[5]; 다차원 배열 1차원 배열에 배열을 하나 이상 추가한 2차원, 또는 그 이상의 배열을 의미 (이건 2차원 배열) int arr2[2][5] //형식 자료형 배열명[세로크기][가로크기]; 2차원 배열은 크기를 뒤부터 읽어서 arr2[2][5]는 5개의 연속된 메모리 공간을 가진 1차원 배열이 2개 있다는 뜻 이 배열의 총 요소는 5 * 2 = 10개 (이건 3차원 배열) int arr4[3][3][3]; // 총요소 3 * 3 * 3 = 27개 실무에서는 2,3차원배열까지 사용하고 그 이상은 잘 사용하지 않음. 다차원 배열 다루기 다차원 배열 초기화하기 //1차원 배열 초기화 int arr[5] = {1, 2, 3, 4, 5}; //2차원 배열..

언어/C 2024.03.21

[코딩자율학습] 13일차 프로젝트 어항에 물주기

전체코드 #include #include #include //전역변수 선언 int level; // 레벨 int arrayFish[6]; // 어항 int* cursor; // 어항 배열에 접근해야하니까 포인터 변수 사용. //함수 선언 void initData(); // 게임 초기화 void printfFishes(); //어항 물 높이 출력 함수 void decreaseWater(long elapsedTime); //어항의 물을 증발(감소)시키는 함수 선언 int checkFishAlive(); //모든 물고기가 죽었는지 확인 함수 int main(void) { long startTime = 0; // long은 int와 같이 정수를 담을 때 사용, 시간을 다룰 때 주로 long을 사용 int num..

언어/C 2024.03.20

[코딩자율학습] 12일차 포인터

📌 변수와 메모리 #include int main(void) { int 철수 = 1; int 영희 = 2; int 민수 = 3; printf("철수네 주소: %p, 암호 : %d\\n", &철수, 철수); //철수네 주소: 0000003D3211F8E4, 암호 : 1 a: 10, b : 20 swap() 함수 안 => a: 20, b: 10 swap() 함수 호출 후 => a: 10, b : 20 함수에서는 a와 b가 값이 바꼈는데 호출 후의 값에는 그대로임. 왜 그럴까??? 실제로는 두 변수 자체가 아닌 두 변수의 값만 전달해서 그럼. 무슨 소리냐면 int main(void) { int a = 10; int b = 20; printf("a의 주소: %p\\n", &a); printf("b의 주소: %p..

언어/C 2024.03.19

[코딩자율학습] 11일차 프로젝트: 자라나라 머리머리

#include #include #include //난수 생성하니까 추가 int main(void) { srand(time(NULL)); int treatment = rand() % 4; //약병 4개 중 하나 선택해야하니까 %4로 난수 생성 printf("\n\n == 자라나라 머리머리 == \n\n"); int cntShowBottle = 0; //이번 회차에 조합할 약병 개수 int prevCntShowBottle = 0; // 앞 회차에서 조합한 약병 개수 //3회 테스트 for (int i = 1; i 1 if (randBottle == treatment) { isIncluded = 1; // 진짜 발모제가 포함됨. } } else { // 이미 선택된 약병이면 중복이므로 다시 선택 j--; /..

언어/C 2024.03.18

[chart.js] 분산형 그래프 포인트를 이미지로

1. 포인트 이미지, 테두리 설정 2. hover시에만 이미지로 📌 포인트 이미지, 테두리 설정 - 분산형 차트..! 뭔가 무시무시해보임. usePointStyle: true, // 포인트 스타일 바꾸기 위해서 true pointStyle: image, // 선언된 이미지 가져옴 clip: false, // 그래프 밖으로 이미지 잘리는 거 막기 위해서 false const imageBorder = { id: 'imageBorder', beforeDatasetsDraw(chart, args, plugins) { const {ctx, data} = chart; ctx.save(); const x = chart.getDatasetMeta(0).data[0].x; const y = chart.getDataset..

언어/Chart.js 2024.03.16