[Flutter] 29. 로그인 화면 만들어보기  import 'package:flutter/material.dart';void main() { runApp(MyApp());}class MyApp extends StatelessWidget { MyApp({super.key}); // TextEditingController로 TextField의 controller에 넣을 객체를 선언 final TextEditingController _emailController = TextEditingController(); @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: fa..

[Flutter] 28. 구글 내장 아이콘과 Material 3 1. 구글 내장 아이콘 사용하기구글 폰츠 - [Icons]에서 사용할 아이콘들을 검색해 찾을 수 있다.   2. 아이콘의 스타일outlined: 윤곽선 스타일rounded: 둥근 스타일sharp: 직선 스타일  3. MaterialApp color theme과 Material 3 색상useMaterial3을 사용하면 Material 라이브러리의 최신 버전 사용 가능useMaterial3과 seedColor, Theme.of.colorScheme를 사용하면 Material3 디자인 가이드에 따른 색을 쓸 수 있다. 4. 시나리오 코드 (1) ColorScheme을 사용해 색상 지정하기import 'package:flutter/material...

[Flutter] 27. 스크롤 바 생성과 폰트 등록, 이미지 사용 1. SingleChildScrollView 위젯이란?(1) SingleChildScrollView 위젯은 스크롤을 제공하기 위해 사용되는 위젯이다.(2) 수직/수평 스크롤을 지정하고자 할 경우, scrollDirection 속성값을 설정할 수 있다.scrollDirection: Axis.vertical (수직)scrollDirection: Axis.horizontal (수평) 2. asset이란?(1) asset은 앱 구성에 필요한 리소스 파일들을 의미한다. 아이콘, 이미지, JSON 파일, 폰트 파일등이 있다.(2) 이런 리소스는 앱 빌드 시 내부에 포함되어야 하고, 이를 위해 pubspec.yaml 파일에 등록이 필요함! *Text..

[Node&React로 유튜브 사이트 만들기] 3. 비디오 업로드 form 만들기 (1)  아래의 로직을 따라 비디로 업로드 form을 만들어보자.   1. npm run dev 터미널 창에 'npm run dev'를 입력해보자. 아래와 같이 localhost가 뜬다. 아래의 랜딩 페이지는 보일러 플레이트로 구현된 것!  아래의 [package.json]-scripts-start는 node.js 서버 시작 시 실행되는 파일을 의미한다.nodemon: 서버를 실행할 때마다 기존 서버 종료-재실행을 자동으로 해주는 라이브러리concurrently: 라이브러리의 일  2. 리덕스 데브툴즈 다운받기리덕스 데브툴즈를 검색해 다운 받을 수 있다. 리덕스 데브툴즈를 활용하면 현재 유저의 상태등을 알 수 있다.   3..

[Node&React로 유튜브 사이트 만들기] 2. Bolier Plate란? -보일러 플레이트: 로그인, 회원가입 같은 공통적인 기능을 재사용 할 수 있게 하는 프로그램  https://youtu.be/fgoMqmNKE18

[설치 메뉴얼] MongoDB 키 발급받기 몽고DB를 사용하기 위한 키를 발급받아보자. 우선 MongoDB 공식 사이트에 접속해, 회원가입/로그인을 해보자. 구글 로그인으로 손쉽게 회원가입-로그인 할 수 있다.https://www.mongodb.com/ko-kr/lp/cloud/atlas/try4?utm_source=google&utm_campaign=search_gs_pl_evergreen_atlas_general-phrase_prosp-brand_gic-null_ww-multi_ps-all_desktop_eng_lead&utm_term=mongodb&utm_medium=cpc_paid_search&utm_ad=p&utm_ad_campaign_id=11295578158&adgroup=1163632050..

[설치 메뉴얼] Node.js 설치하기 1. 최신 버전 다운하기 Node.js를 설치해보자. 우선 구글 검색창에 Node.js를 검색한다. 그러면 아래와 같이 Node.js 공식 사이트를 찾을 수 있다. (https://nodejs.org/en) [Download Node.js]를 클릭하면 인스톨 파일을 설치받을 수 있다. 인스톨 파일 설치가 완료되면 클릭해서 실행해주자.  [accept]를 눌러 Setup 파일을 실행시켜준다. 세 번째와 같은 화면이 뜬다면 성공적으로 설치된 것이다.  명령프롬프트를 실행해, 'node -v'를 입력했을 때 아래와 같이 출력된다면 설치 확인까지 끝났다!   2. 구버전 다운하기 구버전을 다운해보자. 우선 공식 홈페이지에서 [Download]버튼을 클릭해보자. 아래 화면에..

[Node&React로 유튜브 사이트 만들기] 1. Bolier Plate 다운로드 하기  1. 보일러 플레이트 다운하기 보일러 플레이트를 사용해 프로젝트를 제작해보자.보일러 플레이트 다운 주소는 여기 (https://github.com/jaewonhimnae/boilerplate-mern-stack)[Code]-깃 클론을 해주자.  아래와 같이 vscode에서 레포지토리 복제를 해준다.   2. 보일러 플레이트 사용하기(1) npm install아래의 사진처럼 서버/클라이언트별 폴더가 나뉘어져 있는 것을 확인할 수 있다. package.json에 담긴 것들은 라이브러리를 추가하기 위한 dependency들!  [보기]를 눌러 터미널을 켜준다. 'node -v'를 입력해보고, 만약 아래와 같은 스크립트가..

보호글 입니다.

[JavaScript] 짐코딩 - (6) Promise 정적 메서드란? 1. Promise 정적 메서드란?  (1) Promise.resolve()-어떤 비동기 작업을 실행하고, 그 결과를 promise로 다루고 싶을 때 사용하는 정적 메서드./** * 1. Promise.resolve() * 어떤 비동기 작업을 실행하고, 그 결과를 promise로 다루고 싶을 때 사용하는 정적 메서드. */const myPromise = Promise.resolve(100);console.log(myPromise);myPromise .then(value => value / 2) .then(value => value / 10) .then(value => console.log(value)) // 최종..