🏗️ Create basic folder structure for components and config

src/App.js

@@ -1,22 +1,13 @@
-import logo from './logo.svg';
 import './App.css';
+import ChatBubble from './components/ChatBubble';
+import ChatInput from './components/ChatInput';
 
 function App() {
  return (
  <div className="App">
  <header className="App-header">
- <img src={logo} className="App-logo" alt="logo" />
- <p>
- Edit <code>src/App.js</code> and save to reload.
- </p>
- <a
- className="App-link"
- href="https://reactjs.org"
- target="_blank"
- rel="noopener noreferrer"
- >
- Learn React
- </a>
+ <ChatBubble></ChatBubble>
+ <ChatInput></ChatInput>
  </header>
  </div>
  );

src/components/ChatBubble.js

@@ -0,0 +1,9 @@
+import React from 'react';
+
+const ChatBubble = () => {
+ return (
+ <span> chat bubbles zone </span>
+ );
+};
+
+export default ChatBubble;

src/components/ChatInput.js

@@ -0,0 +1,9 @@
+import React from 'react';
+
+const ChatInput = () => {
+ return (
+ <span> chat input zone </span>
+ );
+};
+
+export default ChatInput;