diff --git a/package.json b/package.json
index 60260cf..81e6667 100644
--- a/package.json
+++ b/package.json
@@ -5,11 +5,13 @@
 	"main": "src/index.ts",
 	"scripts": {
 		"devServer": "webpack-dev-server  --mode development --inline --hot --open",
-		"build": "webpack --mode development"
+		"build": "webpack --mode development",
+		"buildProd": "webpack --mode production"
 	},
 	"author": "",
 	"license": "ISC",
 	"devDependencies": {
+		"@types/prop-types": "^15.7.3",
 		"@types/react": "^16.9.34",
 		"@types/react-dom": "^16.9.6",
 		"@typescript-eslint/eslint-plugin": "^2.28.0",
@@ -28,6 +30,7 @@
 		"webpack-dev-server": "^3.10.3"
 	},
 	"dependencies": {
+		"prop-types": "^15.7.2",
 		"react": "^16.13.1",
 		"react-dom": "^16.13.1"
 	}
diff --git a/src/components/Quick.tsx b/src/components/Quick.tsx
new file mode 100644
index 0000000..f40a4bf
--- /dev/null
+++ b/src/components/Quick.tsx
@@ -0,0 +1,24 @@
+import * as React from "react";
+import * as PropTypes from "prop-types";
+
+import "../style/quick.scss";
+
+class Quick extends React.Component {
+	static propTypes = {
+		children : PropTypes.element
+	};
+	
+	constructor(props){
+		super(props);
+	}
+
+	render(): JSX.Element {
+		return <div className="quick-component">
+			{this.props.children}
+		</div>;
+	}
+
+}
+
+
+export default Quick;
diff --git a/src/components/QuickItem.tsx b/src/components/QuickItem.tsx
new file mode 100644
index 0000000..08ec425
--- /dev/null
+++ b/src/components/QuickItem.tsx
@@ -0,0 +1,22 @@
+import * as React from "react";
+import * as PropTypes from "prop-types";
+
+import "../style/quickItem.scss";
+
+class QuickItem extends React.Component {
+	static propTypes = {
+		url: PropTypes.string.isRequired
+	};
+	
+	constructor(props){
+		super(props);
+	}
+
+	render(): JSX.Element {
+		return <div className="quickItem-component">
+		</div>;
+	}
+
+}
+
+export default QuickItem;
diff --git a/src/components/app.tsx b/src/components/app.tsx
index 9ba4a03..272bbd6 100644
--- a/src/components/app.tsx
+++ b/src/components/app.tsx
@@ -1,12 +1,19 @@
 import * as React from "react";
 
+import Quick from "./Quick";
+import QuickItem from "./QuickItem";
+
 class App extends React.Component {
 	constructor(props) {
 		super(props);
 	}
 
 	render(): JSX.Element {
-		return <h1>Hello world</h1>;
+		return <div>
+			<Quick>
+				<QuickItem/>
+			</Quick>
+		</div>;
 	}
 
 }
diff --git a/src/index.tsx b/src/index.tsx
index 57647c7..b45150e 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,7 +1,7 @@
 import * as React from "react";
 import * as ReactDOM from "react-dom";
 
-import App from "./components/app";
+import App from "./components/App";
 
 import "./style/default.scss";
 
diff --git a/src/style/quick.scss b/src/style/quick.scss
new file mode 100644
index 0000000..5872cd0
--- /dev/null
+++ b/src/style/quick.scss
@@ -0,0 +1,3 @@
+.quick-component {
+	background-color: green;
+}
\ No newline at end of file
diff --git a/src/style/quickItem.scss b/src/style/quickItem.scss
new file mode 100644
index 0000000..e69de29