React.js를 이용해서 게시판 만들기
·
프로젝트
※2021-하계-학교-스터디※ 0. 디렉토리 1. 컴포넌트 리스트, 게시글을 컴포넌트로 생각! 2. 코드 item.js (게시글 컴포먼트) // item.js // 게시판 컴포넌트 만들기 = [그림1]의 녹색 부분 import React, { useState } from 'react'; function Item({item}){ return ( {item.id} {item.title} {item.createdAt} ); } export default Item; 함수 Item의 매개변수 item은 properties속성으로 props라고도 불린다. 이 함수는 item을 받아서 해당 item의 id, title, createdAt을 박스에 담아 출력한다. list.js (리스트 컴포넌트) import Reac..
React.js로 카운팅 앱 만들기
·
프로젝트
※2021-하계-학교-스터디※ 0. 디렉토리 구성 1. 카운팅 앱 +1을 누르면 숫자가 증가하고, -1을 누르면 숫자가 감소한다. → 이 앱을 컴포넌트로 분리해보자! 2. 필요한 컴포넌트 숫자를 담을 수 있는 박스 누르면 숫자가 증가하는 버튼 누르면 숫자가 감소하는 버튼 3. 코드 작성하기(counter.js) 변수 선언 const: 다른 값으로 초기화하지 않겠다 let: 흔히 사용하는 변수(값이 바뀜) 태그에서 변수를 불러올 때, 꼭 { }중괄호를 사용해줘야 한다. {}없이, num와 같이 적게 되면, 변수가 아닌 문자열로 인식한다. 태그의 onClick property(props) react에서 엘리먼트에 이벤트를 설정해줄때에는 on이벤트이름={실행하고싶은함수} 형태로 설정해줘야 한다. 그 중에서도 ..
React.js 이용하기
·
프로젝트
※2021-하계-학교-스터디※ • HTML, CSS, JS • React.js란? 0. 디렉토리 구성 1. HTML/CSS/JavaScript 1.웹 사이트 개발 시 필수 요소 ① HTML: 웹 사이트의 뼈대를 구성 // 중요한 태그 : 다른 태그를 담을 수 있는 박스 : 제목 등을 작성하는 태그 ex) 안녕하세요 : 글을 담는 박스 ex) 안녕하세요 : 볼드체로 만들어줌 ex) 안녕하세요 : 버튼 ex) 버튼 ② CSS: 웹 사이트에 미적요소를 추가 ③ JS: 웹 사이트에 기능을 추가 2. React.js 1. React.js란? 웹 애플리케이션을 좀 더 편하게 만들 수 있는 라이브러리 리액트는 컴포넌트로 구성된다. 2. 컴포넌트란? 어떤 기능이나 목적을 갖고 있는 한 요소 또는 집합 3. 리액트 시작..
[JavaScript]TodoList 만들기
·
프로젝트
##링크 https://heewon916.github.io/js-study-lv1/step1/ Document heewon916.github.io ##회고 html이나 css, js를 처음 시작하다 보니까 이해 속도나 의문점이 너무 많이 들었다. 그래도 계속 코드를 적어보니까 나름 어떤 역할을 갖고 있고 어디서 호출되는지 등을 이해할 수 있었다.
[JAVA]복권당첨게임lotteryGame
·
프로젝트
제작일자: 2020.06 [사용된 개념] 변수, 반복문, 선택문 & 클래스 & 생성자 & 상속 & 오버 라이딩 & 오버 로딩 & 추상 클래스 & 배열 [큰 구조] 1~45 숫자들 중 6개의 숫자를 컴퓨터가 랜덤(math.random()이용)으로 뽑아 answerA라는 배열에 순서대로 저장을 한다. 또한 사용자는 1~45중에서 6개의 숫자를 뽑아 순서대로 적어야 한다. 이때 사용될 주 클래스는 guess클래스이다. 그리고 컴퓨터는 사용자가 숫자 몇 개를 맞췄는지 알려주고 그에 맞는 상금을 수여한다. [코드] import java.util.Scanner; //컴퓨터가 복권 답 정하기 class answer { int[] answerA = new int[6]; // 복권 답이 저장될 배열 answerA } c..