본문 바로가기

Develop

[React] Stateful 컴포넌트보다 Stateless 컴포넌트로 작성하자 React에서 컴포넌트(Component) 란? React는 아래와 같이 컴포넌트(Component)를 만들고, 컴포넌트를 조합해서 UI를 구현합니다. class Welcome extends React.Component { render() { return Hello, {this.props.name}; } } Sateful 컴포넌트와 Stateless 컴포넌트 위와 같이 작성하는 React 컴포넌트 중 state 를 사용하는 경우를 Stateful 컴포넌트라 하고, state 를 사용하지 않는 컴포넌트를 Stateless 컴포넌트 라 합니다. 만약 state를 사용하지 않는 Stateless 컴포넌트로 작성할 수 있다면 최대한 state를 사용하지 않도록 컴포넌트를 구현해야 이해하기 쉽습니다. 이해하기 쉬..
[C#] 리플렉션 Reflection (4) : 복잡한 if 문 대신 리플렉션으로 생성 함수 호출하기 복잡한 if 문 대신 리플렉션으로 객체 생성하기 프로젝트를 진행하면서 아래 예제 코드와 같이 형타입에 따라 다른 객체를 생성해야 하는 경우가 있었습니다. if( data is DataTypeA a) { var model = new DataModelA(a); list.Add(model); } else if( data is DataTypeB b) { var model = new DataModelB(b); list.Add(model); } // 엄청 긴 if 문~ 위 예제 코드와 같은 구조로 개발을 하게 되면 데이터 타입이 추가될 때마다, if 문은 계속 길어질 수 밖에 없고 데이터 타입에 따라 DataModel을 생성하는 논리가 달라지면서 if 문 내부도 복잡해져갔습니다. 이러한 구조로 인해 점점 코드는 더..
[C#] 리플렉션 Reflection (3) : PropertyDescriptor.SetValue에 TypeConverter 로 데이터 형변환하기 PropertyDescriptor.SetValue에 TypeConverter 활용하기 리플렉션 Reflection (2) : 타입에 따라 동적으로 객체 생성하기 글에서 TagFactory를 통해 Tag 클래스에 속성 값을 입력할 때, XML 파일의 string을 읽어 string으로 객체에 저장하기 때문에 형변환 문제가 발생하지는 않았습니다. 기본 데이터 타입으로 변환할 때는 문제가 발생하지 않았지만, 만약 개발자가 정의한 클래스로 저장해야 한다면 문제가 발생하게 됩니다. 이러한 데이터 변환 문제를 해결하는 방법을 알려드리도록 하겠습니다. propertyDescriptor.SetValue(tag, propertyDescriptor.Converter.ConvertFromInvariantString(attr..
[C#] 리플렉션 Reflection (2) : 타입에 따라 동적으로 객체 생성하기 타입에 따라 동적으로 객체 생성하기 바로 사용할 수 있는 예제로 리플렉션(Reflection) 기술을 설명드리도록 하겠습니다. 먼저 예제를 사용하는 상황을 설명드리자면, XML 파일을 Parse 해서 태그별로 객체를 생성하려는 상황입니다. 제가 맨 처음 도입한 방식은 누구나 쉽게 떠올릴 수 있는 방법인 태그 이름에 따라 switch 문을 사용한 방법입니다. var tags = new List(); while (xmlReader.Read()) { if (xmlReader.NodeType == XmlNodeType.Element) { switch (xmlReader.Name) { case "A": // A 태그를 해석하여 객체를 만들고 저장합니다. var a = new TagA(xmlReader.GetAtt..
[C#] 리플렉션 Reflection (1) : 왜 알아야 할까? 리플렉션 Reflection 리플렉션 (Reflection) 은 프로그램이 동적으로 소스 코드를 해석할 수 있게 하는 기술입니다. Activity나 Service 같이 특정 이름 규칙으로 클래스를 작성하면 개발자가 코드로 객체를 생성하거나 연결하지 않아도, 프로그램 내에 등록되고 사용할 수 있었던 마법의 원리는 프레임워크가 리플렉션 기술을 사용해 클래스의 이름을 바탕으로 클래스를 생성/관리/제거해주기 때문입니다. 객체를 프레임워크가 관리해주니까, 개발자는 프레임워크에게 요청하면 언제 어디서나 안정적으로 원하는 클래스를 얻을 수 있습니다. 즉 개발자는 클래스로 객체를 생성하는 거나, 객체를 사용할 수 있게 준비하는 일정 부분을 프레임워크에게 믿고 맡길 수 있게 됩니다. 예제 코드를 보여드리자면, 아래와 같..
[Xamarin] MvvmCross 데이터 바인딩 MvvmCross 데이터 바인딩 데이터 바인딩은 MVVM 패턴에서 제일 핵심적인 기능입니다. 데이터 바인딩을 통해 View와 ViewModel 이 서로의 참조 변수를 가지지 않는 형태로 느슨한 결합을 유지할 수 있습니다. MVVM 패턴을 의도했지만 데이터 바인딩을 사용하지 않는다면 MVVM 패턴을 활용하지 못하는 겁니다. MvvmCross에서 데이터 바인딩을 구현하는 순서는 아래와 같습니다. ViewModel에 속성이 변경될 때마다 이벤트를 발생시키도록 구현한다. View에 ViewModel을 연결한다. View 속성에 ViewModel 속성을 Binding 한다. 1. ViewModel에 속성이 변경될 때마다 이벤트를 발생시키도록 구현한다. 데이터 바인딩의 핵심은 ViewModel이 INotifyPro..
[Xamarin] Xamarin 프로젝트에서 MvvmCross 사용하기 Xamarin 프로젝트에서 MvvmCross 사용하기 MvvmCross 공식 문서 나름 Xamarin.Forms 에서 사용하는 방법을 알려주고 있지만 부족한 점이 많아 추가로 설명드리도록 하겠습니다. MvvmCross 샘플 중 [MvxForms] 를 참고해보시면 많은 도움이 되실 겁니다. 이 샘플을 기반으로 설명을 드리도록 하겠습니다. 1. MvxApplication 생성 제일 먼저해야 할 일은 MvxApplication 을 상속받아 Serivce 를 등록하고, 시작 ViewModel을 등록하는 작업입니다. public class CoreApp : MvxApplication { public override void Initialize() { // 모든 클래스 중 이름이 "Service" 로 끝나는 클래스..
[Xamarin] MvvmCross 소개 MvvmCross MvvmCross 는 Platform 에 상관없이 MVVM 패턴을 적용할 수 있도록 만들어진 Nuget 패키지입니다. 즉 MVVM 에서 ViewModel 을 플랫폼 독립적으로 만들 수 있게 지원해줍니다. MvvmCross를 사용하면 플랫폼에 상관없이 비지니스 로직을 만들고 플랫폼 별로 View 만 작성하면 됩니다. .NET Standard 기반을 작성되었기 때문에 모든 .NET 프로젝트에서도 사용할 수 있습니다. Xamarin WPF UWP MvvmCross 이전에는 MvvmLight이 대표적인 패키지였습니다. 하지만 시간이 흐르면서 .NET Framework 기반으로 작성된 MvvmLight 보다는 .NET Standard로 작성된 MVVM 패키지가 필요하게 되었고, MvvmCross..