diff --git a/src/components/forms/CheckBoxWithLabelForm.tsx b/src/components/forms/CheckBoxWithLabelForm.tsx
index 6d155d6..a2af3ab 100644
--- a/src/components/forms/CheckBoxWithLabelForm.tsx
+++ b/src/components/forms/CheckBoxWithLabelForm.tsx
@@ -1,8 +1,9 @@
-import { useId } from "react";
+import { useCallback, useId, useMemo } from "react";
 
 import { Checkbox } from "@/components/ui/checkbox";
 
 import { FormState, Question } from "./FormRenderer";
+import { CheckedState } from "@radix-ui/react-checkbox";
 
 // prettier-ignore
 export type CheckBoxWithLabelFormProps = 
@@ -10,47 +11,59 @@ export type CheckBoxWithLabelFormProps =
     FormState;
 
 export const CheckBoxWithLabelForm = ({
+    questionId,
     questionText,
     options,
     formState,
     setFormState,
 }: CheckBoxWithLabelFormProps) => {
     const htmlFor = useId();
+    const questionIndex = formState.questions.findIndex((q) => q.questionId === questionId);
+
+    const handleCheckboxChange = useCallback(
+        (option: (typeof options)[number], checked: CheckedState) => {
+            const updatedQuestions = [...formState.questions];
+            const updatedOptions = [...updatedQuestions[questionIndex].options];
+
+            if (checked) {
+                updatedOptions.push(option);
+            } else {
+                const optionIndex = updatedOptions.findIndex((opt) => opt.value === option.value);
+                if (optionIndex > -1) updatedOptions.splice(optionIndex, 1);
+            }
+
+            updatedQuestions[questionIndex] = {
+                ...updatedQuestions[questionIndex],
+                options: updatedOptions,
+            };
+
+            setFormState({
+                ...formState,
+                questions: updatedQuestions,
+            });
+        },
+        [formState, questionIndex, setFormState],
+    );
 
     return (
         <div className="flex flex-col gap-1" data-testid="checkbox-with-label-form">
             <p className="font-bold">{questionText}</p>
 
             {options.map((option, index) => {
+                const isChecked = formState.questions[questionIndex].options.some(
+                    (selectedOption) => selectedOption.value === option.value,
+                );
+
                 return (
                     <div key={index} className="flex items-center gap-1">
                         <Checkbox
                             data-testid={`checkbox_${option.label}`}
-                            id={htmlFor}
+                            id={`${htmlFor}_${option.label}`}
                             className="block w-5 h-5"
-                            checked={formState[questionText]
-                                .map((state) => state.value)
-                                .includes(option.value)}
-                            onCheckedChange={(isChecked) => {
-                                if (isChecked) {
-                                    setFormState({
-                                        ...formState,
-                                        [questionText]: [
-                                            ...formState[questionText],
-                                            { value: option.value },
-                                        ],
-                                    });
-                                } else {
-                                    setFormState({
-                                        ...formState,
-                                        [questionText]: formState[questionText].filter(
-                                            (state) => state.value !== option.value,
-                                        ),
-                                    });
-                                }
-                            }}
+                            checked={isChecked}
+                            onCheckedChange={(checked) => handleCheckboxChange(option, checked)}
                         />
-                        <label htmlFor={`checkbox_${option.label}`}>{option.label}</label>
+                        <label htmlFor={`${htmlFor}_${option.label}`}>{option.label}</label>
                     </div>
                 );
             })}
diff --git a/src/components/forms/DoubleSliderWithLabelForm.tsx b/src/components/forms/DoubleSliderWithLabelForm.tsx
index 6d7ac88..4f2adec 100644
--- a/src/components/forms/DoubleSliderWithLabelForm.tsx
+++ b/src/components/forms/DoubleSliderWithLabelForm.tsx
@@ -1,47 +1,70 @@
-import { useEffect, useState } from "react";
+import { useState } from "react";
 
-import { DualRangeSlider, DualRangeSliderProps } from "../ui/slider";
+import { DualRangeSlider } from "../ui/slider";
 import { FormState, Question } from "./FormRenderer";
 
 // prettier-ignore
 export type DoubleSliderWithLabelFormProps =
-    Omit<Question, "questiontype" | "dataType"> &
+    Omit<Question, "questionType" | "dataType"> &
     FormState;
 
 export const DoubleSliderWithLabelForm = ({
+    questionId,
     questionText,
     options,
     formState,
     setFormState,
 }: DoubleSliderWithLabelFormProps) => {
-    const min = options[0];
-    const max = options[options.length - 1];
-
-    const [value, setValue] = useState<number[]>([min.value, max.value]);
+    const question = formState.questions.find((q) => q.questionId === questionId);
 
     return (
         <div>
             <p className="font-bold">{questionText}</p>
             <div className="px-2">
                 <DualRangeSlider
+                    data-testid="double-slider-with-label-form"
                     className="pt-4 pb-10 text-gray-500"
-                    labelPosition="bottom"
-                    defaultValue={[min.value, max.value]}
-                    value={[...value]}
-                    min={min.value}
-                    max={max.value}
+                    defaultValue={[
+                        question?.options[0]?.value || options[0].value,
+                        question?.options[1]?.value || options[options.length - 1].value,
+                    ]}
+                    value={[
+                        question?.options[0]?.value || options[0].value,
+                        question?.options[1]?.value || options[options.length - 1].value,
+                    ]}
+                    min={options[0].value}
+                    max={options[options.length - 1].value}
                     onValueChange={(value) => {
-                        setValue(value);
+                        const updatedQuestions = formState.questions.map((q) =>
+                            q.questionId === questionId
+                                ? {
+                                      ...q,
+                                      options: [
+                                          {
+                                              label: options.find((opt) => opt.value === value[0])
+                                                  ?.label,
+                                              value: value[0],
+                                          },
+                                          {
+                                              label: options.find((opt) => opt.value === value[1])
+                                                  ?.label,
+                                              value: value[1],
+                                          },
+                                      ],
+                                  }
+                                : q,
+                        );
                         setFormState({
                             ...formState,
-                            [questionText]: [{ value: value }],
+                            questions: updatedQuestions,
                         });
                     }}
                     label={(value) => (
-                        <span className="text-sm text-gray-500">
+                        <span className="mt-2 text-sm text-gray-500">
                             {options.find((option) => option.value === value)?.label}
                         </span>
                     )}
+                    labelPosition="bottom"
                 />
             </div>
         </div>
diff --git a/src/components/forms/FormFactory.tsx b/src/components/forms/FormFactory.tsx
index 145ca8f..d7bed67 100644
--- a/src/components/forms/FormFactory.tsx
+++ b/src/components/forms/FormFactory.tsx
@@ -1,6 +1,8 @@
 import { CheckBoxWithLabelForm } from "./CheckBoxWithLabelForm";
+import { DoubleSliderWithLabelForm } from "./DoubleSliderWithLabelForm";
 import { QuestionTypes } from "./FormRenderer";
 import { SelectorWithLabelForm } from "./SelectorWithLabelForm";
+import { SliderWithLabelForm } from "./SliderWithLabelForm";
 
 export interface FormFactoryProps {
     questionType: keyof typeof QuestionTypes;
@@ -10,8 +12,8 @@ export const FormFactory = ({ questionType }: FormFactoryProps) => {
     const FormElements = {
         [QuestionTypes.selector]: SelectorWithLabelForm,
         [QuestionTypes.checkbox]: CheckBoxWithLabelForm,
-        // [QuestionTypes.slider]: SliderWithLabelForm,
-        // [QuestionTypes.doubleSlider]: DoubleSliderWithLabelForm,
+        [QuestionTypes.slider]: SliderWithLabelForm,
+        [QuestionTypes.doubleSlider]: DoubleSliderWithLabelForm,
     };
 
     return FormElements[questionType];
diff --git a/src/components/forms/FormRenderer.tsx b/src/components/forms/FormRenderer.tsx
index ff6b36c..45deff5 100644
--- a/src/components/forms/FormRenderer.tsx
+++ b/src/components/forms/FormRenderer.tsx
@@ -3,8 +3,8 @@ import { FormFactory } from "./FormFactory";
 export const QuestionTypes = {
     checkbox: "checkbox",
     selector: "selector",
-    // slider: "slider",
-    // doubleSlider: "doubleSlider",
+    slider: "slider",
+    doubleSlider: "doubleSlider",
 } as const;
 
 export interface Option {
@@ -13,6 +13,7 @@ export interface Option {
 }
 
 export interface Question {
+    questionId: number;
     questionText: string;
     questionType: keyof typeof QuestionTypes;
     dataType: string;
@@ -20,19 +21,21 @@ export interface Question {
 }
 
 export interface FormProps {
+    _id: string;
     title: string;
     description: string;
     questions: Question[];
 }
 
 export interface FormState {
-    formState: Record<string, Option[]>;
-    setFormState: React.Dispatch<React.SetStateAction<Record<string, Option[]>>>;
+    formState: FormProps;
+    setFormState: React.Dispatch<React.SetStateAction<FormProps>>;
 }
 
 export type FormRendererProps = FormProps & FormState;
 
 export const FormRenderer = ({
+    _id,
     title,
     description,
     questions,
diff --git a/src/components/forms/SelectorWithLabelForm.tsx b/src/components/forms/SelectorWithLabelForm.tsx
index 7778766..6b104bb 100644
--- a/src/components/forms/SelectorWithLabelForm.tsx
+++ b/src/components/forms/SelectorWithLabelForm.tsx
@@ -8,14 +8,19 @@ import {
     SelectValue,
 } from "@/components/ui/select";
 
-import { FormState, Question } from "./FormRenderer";
+import { FormProps, FormState, Question, Option } from "./FormRenderer";
 
 // prettier-ignore
-export type SelectorWithLabelFormProps = 
-    Omit<Question, "questionType" | "dataType"> &
-    FormState
+export type SelectorWithLabelFormProps = {
+    questionId: number;
+    questionText: string;
+    options: Option[];
+    formState: FormProps;
+    setFormState: React.Dispatch<React.SetStateAction<FormProps>>;
+};
 
 export const SelectorWithLabelForm = ({
+    questionId,
     questionText,
     options,
     formState,
@@ -23,19 +28,28 @@ export const SelectorWithLabelForm = ({
 }: SelectorWithLabelFormProps) => {
     const htmlFor = useId();
 
+    const questionIndex = formState.questions.findIndex((q) => q.questionId === questionId);
+
+    const selectedValue = formState.questions[questionIndex].options[0]?.value || "";
+
     return (
         <div data-testid="selector-with-label-form">
             <label className="py-1 font-bold" htmlFor={htmlFor}>
                 {questionText}
             </label>
             <Select
-                value={formState[questionText][0].value}
-                onValueChange={(option) =>
-                    setFormState({
-                        ...formState,
-                        [questionText]: [{ value: option }],
-                    })
-                }
+                value={selectedValue}
+                onValueChange={(selectedValue) => {
+                    const selectedOption = options.find((option) => option.value === selectedValue);
+                    const updatedFormState = { ...formState };
+                    updatedFormState.questions[questionIndex].options = [
+                        {
+                            label: selectedOption?.label || "",
+                            value: selectedValue,
+                        },
+                    ];
+                    setFormState(updatedFormState);
+                }}
             >
                 <SelectTrigger className="w-full rounded-xl" asChild={false}>
                     <SelectValue placeholder="옵션을 선택해주세요"></SelectValue>
diff --git a/src/components/forms/SliderWithLabelForm.tsx b/src/components/forms/SliderWithLabelForm.tsx
index 9255b36..225a42a 100644
--- a/src/components/forms/SliderWithLabelForm.tsx
+++ b/src/components/forms/SliderWithLabelForm.tsx
@@ -1,3 +1,5 @@
+import { useEffect, useState } from "react";
+
 import { Slider } from "@/components/ui/slider";
 
 import { FormState, Question } from "./FormRenderer";
@@ -7,11 +9,8 @@ export type SliderWithLabelFormProps =
     Omit<Question, "questionType" | "dataType"> &
     FormState;
 
-/**
- * 기본 인자
- */
-
 export const SliderWithLabelForm = ({
+    questionId,
     questionText,
     options,
     formState,
@@ -19,6 +18,39 @@ export const SliderWithLabelForm = ({
 }: SliderWithLabelFormProps) => {
     const min = options[0];
     const max = options[options.length - 1];
+    const question = formState.questions.find((q) => q.questionId === questionId);
+    const [value, setValue] = useState(question?.options[0].value);
+
+    useEffect(() => {
+        if (question?.options[0].value !== value) {
+            setValue(question?.options[0].value);
+        }
+    }, [question?.options[0].value]);
+
+    const handleValueChange = (newValue: number[]) => {
+        const updatedValue = newValue[0];
+        setValue(updatedValue);
+
+        const updatedQuestions = formState.questions.map((q) =>
+            q.questionId === questionId
+                ? {
+                      ...q,
+                      options: [
+                          {
+                              value: updatedValue,
+                              label:
+                                  options.find((opt) => opt.value === updatedValue)?.label ||
+                                  String(updatedValue),
+                          },
+                      ],
+                  }
+                : q,
+        );
+        setFormState({
+            ...formState,
+            questions: updatedQuestions,
+        });
+    };
 
     return (
         <div>
@@ -27,14 +59,9 @@ export const SliderWithLabelForm = ({
                 <Slider
                     data-testid="slider-with-label-form"
                     className="pt-4 text-gray-500"
-                    defaultValue={[formState[questionText][0].value]}
-                    value={[formState[questionText][0].value]}
-                    onValueChange={(value) => {
-                        setFormState({
-                            ...formState,
-                            [questionText]: [{ value: value[0] }],
-                        });
-                    }}
+                    defaultValue={[value]}
+                    value={[value]}
+                    onValueChange={handleValueChange}
                     min={min.value}
                     max={max.value}
                     step={1}
diff --git a/src/components/forms/__test__/CheckBoxWithLabelForm.test.tsx b/src/components/forms/__test__/CheckBoxWithLabelForm.test.tsx
index ed66a86..31f108c 100644
--- a/src/components/forms/__test__/CheckBoxWithLabelForm.test.tsx
+++ b/src/components/forms/__test__/CheckBoxWithLabelForm.test.tsx
@@ -1,11 +1,24 @@
 import { CheckBoxWithLabelForm } from "../CheckBoxWithLabelForm";
+import { FormProps } from "../FormRenderer";
 import "@testing-library/jest-dom";
 import { screen, render, fireEvent } from "@testing-library/react";
 
 describe("<CheckBoxWithLabelForm/>", () => {
-    const formState = {
-        "test-question-text": [{ value: "" }],
+    const formState: FormProps = {
+        _id: "uuid-example",
+        title: "test",
+        description: "test",
+        questions: [
+            {
+                questionId: 1,
+                questionText: "test-question-text",
+                questionType: "checkbox",
+                dataType: "number",
+                options: [],
+            },
+        ],
     };
+
     const setFormState = jest.fn();
 
     const options = [
@@ -17,6 +30,7 @@ describe("<CheckBoxWithLabelForm/>", () => {
     beforeEach(() => {
         render(
             <CheckBoxWithLabelForm
+                questionId={1}
                 questionText={"test-question-text"}
                 options={options}
                 formState={formState}
@@ -33,7 +47,7 @@ describe("<CheckBoxWithLabelForm/>", () => {
         expect(screen.getByTestId("checkbox-with-label-form")).toBeInTheDocument();
     });
 
-    test("should render each options properly", () => {
+    test("should render each option properly", () => {
         expect(screen.getByText("options1")).toBeInTheDocument();
         expect(screen.getByText("options2")).toBeInTheDocument();
         expect(screen.getByText("options3")).toBeInTheDocument();
@@ -41,7 +55,7 @@ describe("<CheckBoxWithLabelForm/>", () => {
 
     test("should call setFormState once when checkbox is clicked", async () => {
         const checkbox = await screen.findByTestId("checkbox_options1");
-        expect(checkbox.getAttribute("data-state")).toBe("unchecked");
+        expect(checkbox).toBeInTheDocument();
 
         fireEvent.click(checkbox);
         expect(setFormState).toHaveBeenCalledTimes(1);
diff --git a/src/components/forms/__test__/FormRenderer.test.tsx b/src/components/forms/__test__/FormRenderer.test.tsx
deleted file mode 100644
index 7409d05..0000000
--- a/src/components/forms/__test__/FormRenderer.test.tsx
+++ /dev/null
@@ -1,151 +0,0 @@
-import { FormProps, FormRenderer } from "../FormRenderer";
-import { fireEvent, render, screen } from "@testing-library/react";
-
-/**
- * Each Element's following options data-testid and id
- *
- * <CheckBoxWithLabelForm/>
- * id : checkbox_{option.label}
- * data-testid : checkbox_{option.label}
- *
- * <SelectorWithLabelForm/>
- * data-testid : select-options_{option.label}
- *
- */
-describe("<FormRenderer/>", () => {
-    describe("<SelectorWithLabelForm/>", () => {
-        const formState = {
-            "test-question-selector": [],
-        };
-        const setFormState = jest.fn();
-
-        beforeEach(() => {
-            const formProps: FormProps = {
-                title: "test-title",
-                description: "test-description",
-                questions: [
-                    {
-                        questionText: "test-question-selector",
-                        questionType: "selector",
-                        dataType: "string",
-                        options: [
-                            { label: "options1", value: "options1" },
-                            { label: "options2", value: "options2" },
-                            { label: "options3", value: "options3" },
-                        ],
-                    },
-                ],
-            };
-
-            render(
-                <FormRenderer
-                    title={formProps.title}
-                    description={formProps.description}
-                    questions={formProps.questions}
-                    formState={formState}
-                    setFormState={setFormState}
-                />,
-            );
-        });
-
-        afterEach(() => {
-            jest.clearAllMocks();
-        });
-
-        test("should render 'selector' questions properly", () => {
-            expect(screen.getByTestId("selector-with-label-form")).toBeInTheDocument();
-        });
-
-        test("should call setFormState with appropriate values", () => {
-            fireEvent.click(screen.getByRole("combobox"));
-            fireEvent.click(screen.getByTestId("select-options_options1"));
-
-            const options = ["options1", "options2", "options3"];
-
-            options.forEach((option) => {
-                fireEvent.click(screen.getByRole("combobox"));
-                fireEvent.click(screen.getByTestId(`select-options_${option}`));
-
-                expect(setFormState).toHaveBeenCalledWith({
-                    ...formState,
-                    "test-question-selector": [{ value: option }],
-                });
-            });
-        });
-    });
-
-    describe("<CheckBoxWithLabelForm/>", () => {
-        const formState = {
-            "test-question-checkbox": [],
-        };
-        const setFormState = jest.fn();
-
-        beforeEach(() => {
-            const formProps: FormProps = {
-                title: "test-title",
-                description: "test-description",
-                questions: [
-                    {
-                        questionText: "test-question-checkbox",
-                        questionType: "checkbox",
-                        dataType: "number",
-                        options: [
-                            { label: "options1", value: 1 },
-                            { label: "options2", value: 2 },
-                            { label: "options3", value: 3 },
-                        ],
-                    },
-                ],
-            };
-
-            render(
-                <FormRenderer
-                    title={formProps.title}
-                    description={formProps.description}
-                    questions={formProps.questions}
-                    formState={formState}
-                    setFormState={setFormState}
-                />,
-            );
-        });
-
-        afterEach(() => {
-            jest.clearAllMocks();
-        });
-
-        test("should render 'checkbox' questions properly", () => {
-            expect(screen.getByTestId("checkbox-with-label-form")).toBeInTheDocument();
-        });
-
-        test("should call setFormState once when checkbox is clicked", async () => {
-            const checkbox = await screen.findByTestId(`checkbox_options1`);
-            expect(checkbox.getAttribute("data-state")).toBe("unchecked");
-
-            fireEvent.click(checkbox);
-            expect(setFormState).toHaveBeenCalledTimes(1);
-        });
-
-        test("should call setFormState twice when checkbox is clicked twice", async () => {
-            const checkbox = await screen.findByTestId("checkbox_options1");
-
-            fireEvent.click(checkbox);
-            expect(setFormState).toHaveBeenCalledTimes(1);
-
-            fireEvent.click(checkbox);
-            expect(setFormState).toHaveBeenCalledTimes(2);
-        });
-
-        test("should call setFormState with appropriate values", () => {
-            const checkboxes = [{ label: "options1" }];
-
-            checkboxes.forEach((checkbox) => {
-                fireEvent.click(screen.getByTestId(`checkbox_${checkbox.label}`));
-
-                expect(setFormState).toHaveBeenCalledWith({
-                    ...formState,
-                    "test-question-checkbox": [{ value: true }],
-                });
-            });
-        });
-    });
-});
diff --git a/src/components/forms/__test__/SelectorWithLabelForm.test.tsx b/src/components/forms/__test__/SelectorWithLabelForm.test.tsx
index eaae812..b673eb6 100644
--- a/src/components/forms/__test__/SelectorWithLabelForm.test.tsx
+++ b/src/components/forms/__test__/SelectorWithLabelForm.test.tsx
@@ -1,10 +1,23 @@
+import { FormProps } from "../FormRenderer";
 import { SelectorWithLabelForm } from "../SelectorWithLabelForm";
 import { fireEvent, render, screen } from "@testing-library/react";
 
 describe("<SelectorWithLabelForm/>", () => {
-    const formState = {
-        "test-question-selector": [{ value: "" }],
+    const formState: FormProps = {
+        _id: "test-id",
+        title: "test-title",
+        description: "test-description",
+        questions: [
+            {
+                questionId: 1,
+                questionText: "test-question-selector",
+                questionType: "selector",
+                dataType: "string",
+                options: [],
+            },
+        ],
     };
+
     const setFormState = jest.fn();
 
     const options = [{ label: "option__label", value: "option__value" }];
@@ -12,6 +25,7 @@ describe("<SelectorWithLabelForm/>", () => {
     beforeEach(() => {
         render(
             <SelectorWithLabelForm
+                questionId={1}
                 questionText="test-question-selector"
                 options={options}
                 formState={formState}
@@ -30,16 +44,16 @@ describe("<SelectorWithLabelForm/>", () => {
 
     test("should call setFormState with appropriate values", () => {
         fireEvent.click(screen.getByText("옵션을 선택해주세요"));
-
-        options.forEach((option) => {
-            fireEvent.click(screen.getByText(`option__label`));
-
-            expect(setFormState).toHaveBeenCalledWith({
-                ...formState,
-                "test-question-selector": [{ value: option.value }],
-            });
-
-            jest.clearAllMocks();
+        fireEvent.click(screen.getByText("option__label"));
+
+        expect(setFormState).toHaveBeenCalledWith({
+            ...formState,
+            questions: [
+                {
+                    ...formState.questions[0],
+                    options: [{ label: "option__label", value: "option__value" }],
+                },
+            ],
         });
     });
 });
diff --git a/src/components/forms/__test__/SliderWithLabelForm.test.tsx b/src/components/forms/__test__/SliderWithLabelForm.test.tsx
deleted file mode 100644
index cc4feea..0000000
--- a/src/components/forms/__test__/SliderWithLabelForm.test.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import { SetStateAction } from "react";
-
-import { FormProps, FormState, Option } from "../FormRenderer";
-import { SliderWithLabelForm } from "../SliderWithLabelForm";
-import { render, screen } from "@testing-library/react";
-
-describe("<SliderWithLabelForm/>", () => {
-    const formState = {
-        "test-question-slider": [{ value: 2 }],
-    };
-    const setFormState = jest.fn();
-
-    const options = [
-        { label: "label1", value: 1 },
-        { label: "label2", value: 2 },
-        { label: "label3", value: 3 },
-    ];
-
-    beforeAll(() => {
-        global.ResizeObserver = class ResizeObserver {
-            observe() {}
-            unobserve() {}
-            disconnect() {}
-        };
-    });
-
-    beforeEach(() => {
-        render(
-            <SliderWithLabelForm
-                questionText={"test-question-slider"}
-                options={options}
-                formState={formState}
-                setFormState={setFormState}
-            />,
-        );
-    });
-
-    afterEach(() => {
-        jest.clearAllMocks();
-    });
-
-    test("should render Container properly", () => {
-        expect(screen.getByTestId("slider-with-label-form")).toBeInTheDocument();
-    });
-
-    test("should render min, max label properly", () => {
-        expect(screen.getByText("label1")).toBeInTheDocument();
-        expect(screen.getByText("label3")).toBeInTheDocument();
-    });
-});
diff --git a/src/components/utils/FormFactory.tsx b/src/components/utils/FormFactory.tsx
new file mode 100644
index 0000000..876d11c
--- /dev/null
+++ b/src/components/utils/FormFactory.tsx
@@ -0,0 +1,31 @@
+export const FormTypeMap = {
+    checkbox: "checkbox",
+    selector: "selector",
+    // slider: "slider",
+    // doubleSlider: "doubleSlider",
+} as const;
+
+export type FormType = keyof typeof FormTypeMap;
+
+export type FormOption = {
+    label?: string;
+    value: any;
+};
+
+/**
+ * formTitle : 각 질문마다
+ */
+export interface createFormItemOptions {
+    formTitle: string;
+    formType: FormType;
+    dataType: string;
+    options: FormOption[];
+}
+
+export interface IFormItemFactory {
+    createFormItem({ formType }): React.ComponentType;
+}
+
+export class FormFactory implements IFormItemFactory {
+    public static createFormComponent() {}
+}