2024/11/06 10

[2일차] Admin Page - 회원 관리

CRUD(1) xml(2) model, DTO(3) Interfaces -> Repository(4) Service(5) Controller(6) 화면 구성관리자 페이지에서 어떤 목적과 어떤 기능을 만들건지 잘 설계하고 들어가기!!회원 관리 기능-  회원 조회-  회원 생성-  회원 삭제-  회원 수정에서 조회랑 탈퇴(삭제) 기능만 만들 예정 (생성과 수정은 다른 페이지에서 하기로 설계를 했습니다.) sql-- 유저 테이블create table user_tb ( id int primary key auto_increment, user_id varchar(50) not null, name varchar(20) null, password varchar(1000) not null, nickname v..

My Project/amigo 2024.11.06

[Flutter] 앱 레퍼런스 참고하여 Flutter로 화면 구현하기

* 참고 * images 파일 -> 안에 삽입할 이미지를 넣어준다pubspec.yaml 파일에 다가assets: - assets/images/image.png를 입력해줍니다 ClipRRect( child: Image.asset( 'assets/images/image.png', // 이미지 경로 fit: BoxFit.cove" data-og-host="maze910.tistory.com" data-og-source-url="https://maze910.tistory.com/251" data-og-url="https://maze910.tistory.com/251" data-og-image="https://scrap.kakaocdn.net/dn/b4La6M/hyXs0uWWBy/kDdx0k93McmUKJhtxF..

Flutter 2024.11.06

[Flutter] 텍스트 폰트 설정하기

Browse Fonts - Google FontsMaking the web more beautiful, fast, and open through great typographyfonts.google.com폰트를 정하고 다운을 받아줍니다➡️ 압축을 해줘해준 후assets 파일 -> fonts 파일 -> 다운 받은 폰트를 넣어줍니다fonts: - family: LilitaOne fonts: - asset: assets/fonts/LilitaOne-Regular.ttfpubspec.yaml 파일에 코드를 적어줍니다Text( 'YAYoung', style: TextStyle( color: Color(0xFF104B3A),// #104B3A 색상 지정 fontSize: 30..

Flutter 2024.11.06

[Flutter] Expanded 위젯

위젯 크기를 수치로 설정하지 않고, 비율로 설정할 때 사용하는 위젯화면 사이즈가 다양할 수 있기 때문에, 수치로 위젯 크기를 설정할 경우, 여러 화면 사이즈 대응이 어려울 수 있음따라서, 비율로 위젯 크기를 설정하는 방법에 대해 알아둘 필요가 있음Expanded 위젯의 flex 속성은 각 자식 위젯이 다른 자식 위젯과 비교하여 차지해야 하는 공간의 양을 지정하는 데 사용다음 예제에서는 첫 번째 Expanded 위젯의 flex 속성을 1로, 두 번째 Expanded 위젯의 flex 속성을 2로 설정첫 번째 Expanded 위젯은 Column의 1/3, 두 번째 Expanded 위젯은 Column의 2/3 공간을 차지하며 화면에 표시됨 import 'package:flutter/material.dart';v..

Flutter 2024.11.06

[Flutter] Align 위젯

Align 위젯자식 위젯을 특정 위치에 정렬하기 위해 사용하는 위젯특정 위치에 위젯을 배치하기 위한 위젯은 Align과 Positioned가 있지만,Positioned는 Stack 안에서만 사용할 수 있고, Align은 독립적으로도 사용 가능함Align에서 자식 위젯의 위치는 alignment 속성으로 설정alignment 속성값은 주로 Alignment 클래스 설정값 (예: Alignment.bottomRight, 오른쪽 하단부에 위치)Alignment 주요 값Alignment.topLeft: 위젯을 부모 위젯의 왼쪽 상단 모서리에 맞춤Alignment.topCenter: 위젯을 부모 위젯의 상단 중앙에 맞춤Alignment.topRight: 위젯을 부모 위젯의 오른쪽 상단 모서리에 맞춤Alignmen..

Flutter 2024.11.06

[Flutter] Stack 위젯

Row 위젯은 내부 위젯을 수평으로 나열하는 위젯, Column 위젯은 내부 위젯을 수직으로 나열하는 위젯Stack 위젯은 내부 위젯을 겹쳐서 나열하는 위젯import 'package:flutter/material.dart';void main(){ runApp(MyApp7());}class MyApp7 extends StatelessWidget { const MyApp7({super.key}); @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: false, home: Scaffold( body: Stack( children: [..

Flutter 2024.11.06

[Flutter] AppBar 사용법과 주요 property

backgroundColor: AppBar 배경색elevation: AppBar를 어느 정도 떠오르게 설정 (그림자 깊이가 달라짐)title: 보통 Text 위젯으로 타이틀 표시centerTitle: true로 설정하면, 타이틀이 가운데 위치leading: 제목 앞에 표시되는 위젯. 보통 IconButton 위젯으로 메뉴 등을 표시actions: 제목 뒤에 표시되는 위젯. 보통 IconButton 위젯으로 메뉴 등을 표시 import 'package:flutter/material.dart';void main() { runApp(MyHome2());}class MyHome2 extends StatelessWidget { const MyHome2({super.key}); @override Widget..

Flutter 2024.11.06

[Flutter] MaterialApp의 주요 property와 사용법

theme: 앱의 전체 테마, 색상 구성 등이 포함 (예, theme: ThemeData(primarySwatch: Colors.red))home: 앱이 시작할 때 보여질 기본 경로 또는 위젯  Scaffold 위젯 사용법과 주요 property MaterialApp 내에서 머티리얼 디자인의 기본 레이아웃 구조를 제공하는 위젯주요 propertyappBar: 화면의 상단에 있는 앱 바.보통 value로 AppBar(title: const Text('FunCoding'))와 같이 AppBar 위젯을 넣는 경우가 많음body: 화면의 기본 내용, 일반적으로 위젯의 목록.floatingActionButton: 인터페이스에 위치한 추가 버튼.floatingActionButtonLocation: 부가 버튼의 위치..

Flutter 2024.11.06

[Flutter] 기초적인 Flutter 화면을 구성하는 패턴

'package:flutter/material.dart' 임포트MaterialApp으로 메인 위젯 트리 감싸기title과 theme과 같은 속성 설정home : 속성을 주 페이지로 정의Scaffold:앱의 시각적 레이아웃에 대한 기본 구조 제공appBar 및 body와 같은 속성 설정레이아웃 요소 제공 (예: AppBar, Drawer, BottomNavigationBar)각 구성요소는 또 다른 위젯으로 각각의 사용법은 이후에 정리하기로 함body에 실제 화면 관련 위젯 정의import 'package:flutter/material.dart';void main(){ runApp(MyApp());}// 상태 기반 UIclass MyApp extends StatelessWidget { const MyAp..

Flutter 2024.11.06