본문 바로가기



전체  > 전체 글 (88)

001. 제이쿼리 날코딩 조합 - 테이블에 데이터 바인딩 javascript와 jquery 날코딩 조합으로 테이블에 서버에서 받은 데이터를 바인딩 해봅시다. UI프레임웍을 제공하지 않는 프로젝트에서 최소한의 도구를 가지고 제이쿼리와 날코딩조합으로 접근해 보았습니다. 서버에서 데이터를 가져와서 html의 table tr행에 표현해 주려고 합니다. 구조는 아래와 같습니다. 1. 서버에서 json기반의 데이터를 받았습니다. 만약 서버에서 받은 데이터가 json형태가 아니라면 별도록 서버데이터 가공이 필요합니다. //서버에서 받은 json데이터 var rs = [ {"idx":"1", "name":"이제니", "id":"m001", "pwd":"11"} , {"idx":"2", "name":"안유진", "id":"m002", "pwd":"22"} ]; 2. head의..


Dart 18. 상속과 추상 클래스 {유목민 알폰스} dart에서 클래스의 상속에 대해서 정리해 보겠습니다. 1. 상속 SubClass는 ParentClass의 자원을 상속받았기 때문에 body부분에 코드가 기술되지 않았지만 부모코드에서 기술된 자원을 사용할 수 있습니다. class ParentClass { int val = 10; void fun() { print("Parent..fun()..."); } } class SubClass extends ParentClass {} main() { var obj = SubClass(); obj.fun(); print("obj.val : ${obj.val}"); } 결과) Parent..fun()... obj.val : 10 2. 오버라이딩 부모클래스의 속성을 그대로 사용할수도 있지만 상속을 받은 다음에 변경하고 ..


Dart 17. 명명된 생성자와 상수 생성자 {유목민 알폰스} 2023.11.08 - [Client/Dart] - Dart 16. 클래스 생성과 호출 그리고 초기화 {유목민 알폰스} 명명된 생성자와 상수 생성자의 사용법과 특성을 알아봅시다. 명명된 생성자는 한 클래스의 여러 개의 다른 종류의 생성자를 작성할 수 있습니다. 점(.)으로 연결해서 다양한 생성자의 구현이 가능합니다. 오버로딩은 매개변수를 보고 용도를 구분하지만 이렇게 이름으로 명시함으로써 가독성이 더 높아진다고 볼 수 있습니다. 상수 생성자는 기존에 동일한 객체의 요청이 있을 때 새로 생성하지 않고 이미 생성된 객체를 활용하므로 애플리케이션의 성능을 개선할 수 있습니다. 명명된 생성자를 통한 여러 개의 다양한 생성자를 정의해 봅시다. class TestClass { TestClass() {} TestCl..


Dart 16. 클래스 생성과 호출 그리고 초기화 {유목민 알폰스} DART클래스를에 대한 생성과 호출 변수와 메소드의 초기화를 비롯한 여러가지 다양한 특성들을 살펴 봅니다. 클래스 생성과 선언 호출 class User{ String name = '알폰스'; int age = 25; void setHello(){ print('Hello $name, age: $age'); } } main(List args){ User user = new User();//객체의 생성 print(user.name);//멤버변수 접근 print(user.age);//멤버변수 접근 user.setHello();//멤버메소드 접근 } 출력) 알폰스 25 Hello 알폰스, age: 25 ---------------------------------------- main(List args){ User..


Dart 15. 함수와 제어문 {유목민 알폰스} dart에서 함수를 생성 후 getter, setter를 통 안 입출력 및 기타 연산자를 알아보겠습니다. 함수 선언하고 호출하기 매개변수의 사용 옵셔널 위치 매개변수 함수 타입 인수 getter setter 함수 연산자의 활용 실행 흐름의 제어 1. 함수 선언과 호출 //톱레벨 함수 void fun1(){ } //톱레벨함수 안에 함수 void fun2(){ void fun2_1(){ } fun2_1(); } //클래스 안에 함수 class TestClass{ void getTest(){ } } 함수의 중복 오버로딩을 지원하지 않습니다. 오버로딩을 대신할 옵셔널 매개변수라는 기능이 있기 때문에 굳이 오버로딩을 지원하지 않아도 되는 것입니다. 매개변수의 타입은 명시하거나 모든타입을 받을 수 있는 var타입을..


Dart 14. 널 안전성 변수선언 {유목민 알폰스} Dart는 널 안전성을 지원하는 프로그램입니다. 널 안전성을 지원하지 않는 프로그램들은 객체에 null값을 대입할 수 있으므로 NullPointerException발생시키는 빈도가 높습니다. Dart에서는 기본적으로 변수에 null값을 허용하지 않기때문에 실행되기 이전에 미리 에러를 발생시켜서 null안정성을 지원해주고 있습니다. 기본은 null값을 대입하지 못합니다. 하지만 변수 선언시 물음표? 옵션을 붙여주면 null을 허용하게 됩니다. 즉 널허용 변수와 널 불허 변수를 모두 생성할 수 있습니다. int1은 null을 담을수담을 수 있었고 int2는 null을 담을 수 없기 때문에 붉게 표시되고 에러가 나는 것을 볼 수 있습니다. int var1 = null; //


Dart 13. 컬렉션 타입 List Set Map {유목민 알폰스} 테이블 처럼 행, 열이 있는 복잡한 형태의 데이터를 저장할수 있는 변수타입 입니다. List, Set, Map 타입에 대해서 알아 보겠습니다. 1. List 타입 List 꺽쇠 안에 타입을 선언하면 배열안에 들어갈수 있는 타입이 지정이 됩니다. List 꺽쇠와 타입지정이 없기 때문에 배열안에 들어갈 타입은 다이나믹 타입이 됩니다. 그래서 모든 타입의 변수를 담을수 있습니다. [실행] void main() { List rs = [123, "테스트", true]; rs[0] = 100; rs[1] = "홍길동"; print('rs:[${rs[0]}, ${rs[1]}, ${rs[2]}]'); } [결과] rs:[100, 홍길동, true] 제네릭으로 타입을 지정했다면 지정한 타입만 대입할수 있습니다. void..


Dart 12. { const, final }와 { var, dynamic } 타입 {유목민 알폰스} const final var dynamic 타입의 변수들을 알아보겠습니다. 1. const 타입 { 함수 안의 지역변수, 톱 레벨 }에서 선언가능합니다. 클래스에서 선언할 때는 무조건 static변수로 선언해야 합니다. 선언할 때 무조건 초기값을 지정해야 합니다. 한번 선언이 되면 값을 바꿀 수 없습니다. const타입에 변수값을 대입할 때는 반드시 ( const = const ) 같은 const끼리만 대입가능합니다. main() { String str01 = "문자값"; const String const01 = "커스트고정값"; final String final01 = "파이널고정값"; } 2. final 타입 {함수안의 지역변수, 클래스 안의 지역변수}에서 선언이 가능합니다. 클래스에서 선언할 때도 ..


윈도우에서 마법같은 치트기로 업무효율 높여보세요 {유목민 알폰스} 각종 폴더위치 복잡한 구조로 꼭꼭 숨어 있는 파일의 접근 필요한 프로그램을 빠르게 실행 이 모든 것을 사용자가 자유롭게 구성한 단축키로 손쉽게 접근합니다. [ SlickRun 무료다운로드 ] Bayden SlickRun Bayden SlickRun is a free floating command line utility for Windows. bayden.com 1. 다운로드 후 설치를 완료합니다. 완료하면 이렇게 윈도우 하단에 작음 입력박스가 나타납니다. 입력박스의 위치는 마우스로 끌어서 편한 것에 위치해 두고 사용하시면 됩니다. 2. 입력박스 위에서 마우스 우클릭 해서 환경설정을 해줍니다. 3. Options탭으로 이동해 보면 단축키를 설정할 수 있습니다. 혹시 기본 단축키가 충돌이 난다면 단축키를 바..


윈도우에서 사용할수 있는 무료 영한 번역기 {유목민 알폰스} WINDOW에서 사용할 수 있는 가볍고 심플한 무료번역기를 소개합니다. QTranslate는 컴퓨터에서 셀렉되는 모든 문자를 번역할 수 있다는게 가장 편리한 부분입니다. 컴퓨터의 구석구석 어느 프로그램에서라도 문자만 마우스로 긁을 수 있다면 셀렉션된 모든 부분은 번역이 가능 합니다. 하단에 보시면 여러가지 번역기를 선택할 수 있는데{네이버파파고, 구글번역기}의 엔진도 포함이 되어있네요. 마우스로 텍스트를 긁어서 셀렉션한 상태에서 ctrl+q를 하시면 조그만한 번역창에서 번역을 해줍니다. 물론 그 조그만한 창을 클릭해서 큰 창으로 본격적으로 볼 수도 있습니다. [ 다운로드 ] QTranslate Windows 용 무료 과학 및 교육 프로그램 qtranslate.softonic.kr By. 유목민 알폰스 A..


Dart 11. 데이터 타입 [String, int, double] Type 사용 Dart에서 사용하는 데이터 타입들과 그 특성을 정리해 보았습니다. String타입 1. String 선언 및 표기방식 홑따옴표와 큰따옴표는 둘은 동일하게 동작하고 삼중홑따옴표와 삼중큰따옴표 둘이 동일하게 동작한다. 홑따옴표 ('문자') : 일렬로만 출력된다. 특수문자를 결합해야 줄 바꿈이나 탭표시가 가능하다. 큰따옴표 ("문자") : 일렬로만 출력된다. 특수문자를 결합해야 줄 바꿈이나 탭표시가 가능하다. 삼중홑따옴표('''문자''') : 출력해 보면 엔터처리나 탭키까지 모두 적용이 된다. 삼중큰따옴표("""문자""") : 출력해 보면 엔터처리나 탭키까지 모두 적용이 된다. main() { String str1 = '우리나라'; String str2 = "대한민국"; String str3 = ''' 우리..


Flutter 04. 핸드폰에서 Flutter실행하기 자신의 핸드폰에서 플러터를 실행합니다. 가이드는 안드로이드폰 기준으로 작성되었습니다. 안드로이드폰에서 실행 및 디버깅에 관한 가이드입니다. 1. 핸드폰의 상단 설정메뉴 실행 검색 돋보기를 클릭합니다. 2. 검색창에 빌드번호라고 입력하면 푸른색 글씨로 빌드번호링크가 검색됩니다. 빌드번호링크를 클릭 3. 빌드번호를 연속해서 개발자 옵션이 활성화되었다고 뜰 때까지 클릭합니다. 4. 개발자 옵션을 클릭합니다. 개발자 옵션이 활성화되었다는 메시지가 뜨고 나서 설정으로 돌아가면 기존에 보이지 않았던 개발자옵션 항목이 표시되어 있습니다. 개발자 옵션을 클릭합니다. 5. USB디버깅을 활성화해줍니다. 6. 먼저 핸드폰과 컴퓨터를 USB잭으로 연결하고 vsCode의 터미널창 또는 윈도우 command창을 열고 flutt..


Flutter 03. 비쥬얼 스튜디오 코드에서 Flutter프로젝트 생성 {유목민 알폰스} 비쥬얼 스튜디오 코드에서 플러터 프로젝트를 생성하고 다양한 디바이스로 실행해 보겠습니다. 하단에 가이드에 대한 보충설명을 영상으로 제공하고 있으니 참조하시길 바랍니다. 1. 상단 View메뉴에서 Command Palette... 선택합니다. Flutter:New Project 선택 Application 선택 프로젝트를 저장할 디렉터리 선택 여기서는 D:\prj\workspace\hello로 선택 2. 프로젝트 디렉터리가 지정 > 프로젝트 이름을 입력 여기서는 hello_prj를 입력합니다. 3. 프로젝트가 생성되었고 main.dart 실행파일이 보입니다. 4. 프로젝트를 실행할 때 브라우저 실행 또는 모바일 시뮬레이터에서 실행가능 합니다. 여러 가지 다양한 디바이스가 제공되므로 선택해서 실행이 가능합니다..


Flutter 02. 안드로이드 스튜디오에서 Flutter플러터 프로젝트 생성 {유목민 알폰스} 안드로이드 스튜디오에서 Flutter프로젝트를 생성하고 다양한 디바이스 선택과 실행까지의 진행 과정을 상세한 가이드와 함께 영상으로 제공합니다. 디바이스 실행 웹브라우저에서 샘플프로젝트를 실행해 봅니다. 윈도우앱으로 Flutter을 실행해 봅니다. 핸드폰 디바이를 사용자가 직접 만들고 생성해서 실행까지 해봅니다. Flutter가 Dart언어를 기반으로 하고 있기 때문에 Dart와 중복되는 부분이 있어서 아래 링크로 상세한 설명을 드리겠습니다. [ 안드로이드에서 Flutter프로젝트 생성 ] DART 05. 안드로이드 스튜디오 Flutter프로젝트 생성 {유목민 알폰스} 1. [ New Flutter Project ] 클릭 합니다. 안드로이드 스튜디오를 처음 실행하면 Welcome페이지가 뜹니다. [ Ne..


Flutter 01. 플러터를 시작하기 위한 환경설정 {유목민 알폰스} Flutter을 처음 시작하기 위해서는 사전에 준비해야 할 것들이 많이 있습니다. 필요한 부분들을 정리해서 설명드리겠습니다. 필요한 준비물 Flutter SDK다운로드 후 압축 풀고 환경변수 등록 안드로이드 스튜디오설치 후 Flutter플러그인 설치 VsCode 비쥬얼 스튜디오코드 설치 후 Flutter플러그인 설치 Visual Studio 설치 {윈도우앱 개발 시 필요} 모두 완벽하게 설치가 되었다면 command창이나 터미널창을 열어서 flutter doctor이라고 입력했을 때 커멘트 창에 모두 녹색 체크표가 뜰 것입니다. 설치가 모두 완료되었을 때 상세한 내용을 {유목민 알폰스}의 다른 게시글을 통해서 소개 드립니다. Flutter을 공부하기에 앞서 DART를 먼저 학습하시면 많은 도움이 될 것입..


티스토리 관리자에서 설정한 파비콘이 적용되지 안될때 해결방법 {유목민 알폰스} 티스토리의 관리자 모드에서 파비콘을 설정했는데 적용이 절반은 되었고 절반은 되지 않았습니다. 구글 크롬 브라우저에서는 잘 적용이 되었지만 MS 엣지 브라우저에서는 파비콘 표시가 되지 않았습니다. 아래는 {유목민 알폰스} 티스토리에 적용할 파비콘(ICON)입니다. 분명 이렇게 관리자 모드를 통해서 파비콘을 등록하였습니다. 크롬과 엣지 브라우저를 동시에 띄워 놓고 보면 결과는 아래와 같습니다. 동일한 URL로 접속했지만 위쪽의 크롬브라우저에서만 등록한 파비콘이 설정되었습니다. 2개의 브라우져 모두 캐시삭제까지 완료했지만 엣지에서는 표시가 되지 않았습니다. 이렇게 해결했습니다. 티스토리의 관리자 모드 > 좌측의 스킨편집 메뉴 우측의 HTML편집 버튼을 클릭합니다. 파일업로드탭으로 이동합니다. 하단의 추가 버튼..