Add README, Post Level Service

-This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+<div id="top"></div>
+<!--
+*** Thanks for checking out the Best-README-Template. If you have a suggestion
+*** that would make this better, please fork the repo and create a pull request
+*** or simply open an issue with the tag "enhancement".
+*** Don't forget to give the project a star!
+*** Thanks again! Now go create something AMAZING! :D
+-->
 
 
+
+
+<!-- PROJECT SHIELDS -->
+<!--
+*** I'm using markdown "reference style" links for readability.
+*** Reference links are enclosed in brackets [ ] instead of parentheses ( ).
+*** See the bottom of this document for the declaration of the reference variables
+*** for contributors-url, forks-url, etc. This is an optional, concise syntax you may use.
+*** https://www.markdownguide.org/basic-syntax/#reference-style-links
+-->
+[![Contributors][contributors-shield]][contributors-url]
+[![Forks][forks-shield]][forks-url]
+[![Stargazers][stars-shield]][stars-url]
+[![Issues][issues-shield]][issues-url]
+[![MIT License][license-shield]][license-url]
+[![LinkedIn][linkedin-shield]][linkedin-url]
+
+
+
+<!-- PROJECT LOGO -->
+<br />
+
+<div align="center">
+  <a href="https://github.com/github_username/repo_name">
+    <img src="images/logo.png" alt="Logo" width="80" height="80">
+  </a>
+<h3 align="center">Learn In Web</h3>
+
+  <p align="center">
+    NextJS Website for learn programming without any IDE.
+    <br />
+    <a href="https://code.sungjin.dev"><strong>View Demo »</strong></a>
+    <br />
+    <br />
+    <a href="http://khuhub.khu.ac.kr/2021105619/learn_in_web/issues">Report Bug</a>
+    ·
+    <a href="http://khuhub.khu.ac.kr/2021105619/learn_in_web/issues">Request Feature</a>
+  </p>
+
+</div>
+
+
+
+<!-- TABLE OF CONTENTS -->
+<details>
+  <summary>Table of Contents</summary>
+  <ol>
+    <li>
+      <a href="#about-the-project">About The Project</a>
+      <ul>
+        <li><a href="#built-with">Built With</a></li>
+      </ul>
+    </li>
+    <li>
+      <a href="#getting-started">Getting Started</a>
+      <ul>
+        <li><a href="#prerequisites">Prerequisites</a></li>
+        <li><a href="#installation">Installation</a></li>
+      </ul>
+    </li>
+    <li><a href="#usage">Usage</a></li>
+    <li><a href="#roadmap">Roadmap</a></li>
+    <li><a href="#contributing">Contributing</a></li>
+    <li><a href="#license">License</a></li>
+    <li><a href="#contact">Contact</a></li>
+    <li><a href="#acknowledgments">Acknowledgments</a></li>
+  </ol>
+</details>
+
+
+
+<!-- ABOUT THE PROJECT -->
+## About The Project
+
+[![Product Name Screen Shot][product-screenshot]](https://example.com)
+
+This project allows users to run codes and study without any IDE. This project focusd on schools, and students for study.
+
+Why we need this project? : 
+
+In Korea, learning programming is essential in school. So students wants to learn programming in school; however it is difficult for students to study programming without computer. 
+
+So run this project in school server, and allow students to access this page. So they can study, and run code only with phone, or tablet.
+
+<p align="right">(<a href="#top">back to top</a>)</p>
+
+
+
+### Built With
+
+* [Next.js](https://nextjs.org/)
+
+<p align="right">(<a href="#top">back to top</a>)</p>
+
+
+
+<!-- GETTING STARTED -->
 ## Getting Started
 ## Getting Started
 
 
-First, run the development server:
+This is an example of how you may give instructions on setting up your project locally.
+To get a local copy up and running follow these simple example steps.
+
+### Prerequisites
+
+This is an example of how to list things you need to use the software and how to install them.
+* npm
+  
+  ```sh
+  npm install npm@latest -g
+  ```
+
+* <table>
+    <a href="http://khuhub.khu.ac.kr/2021105619/learn-in-web-backend">Backend Server & Database</a>
+  </table>
+
+* Installation
+
+1. Clone the repo
+   ```sh
+   git clone http://khuhub.khu.ac.kr/2021105619/learn_in_web
+   ```
+
+2. Install NPM packages
+   ```sh
+   npm install
+   ```
+
+3. Enter your SERVER_BASE_URL in `src/api/index.js`
+   ```js
+   export const SERVER_BASE_URL = '127.0.0.1:4000';
+   ```
+
+4. Build & Run
+
+   ```sh
+   npm run build && npm run start
+   ```
+
+5. For Developer
+
+   ```sh
+   npm run dev
+   ```
+
+   
+
+<p align="right">(<a href="#top">back to top</a>)</p>
+
+
+
+<!-- USAGE EXAMPLES -->
+
+## Usage
+
+Use this space to show useful examples of how a project can be used. Additional screenshots, code examples and demos work well in this space. You may also link to more resources.
+
+_For Demo, please see my demo website [Demo](https://code.sungjin.dev/)_
+
+<p align="right">(<a href="#top">back to top</a>)</p>
+
+
+
+<!-- ROADMAP -->
+## Roadmap
+
+- [x] Add README
+- [ ] Add How to Use for new user
+- [ ] Add Saving with DB
+- [ ] Multi-language Support
+  - [ ] English
+  - [ ] Japanese
+
+- [ ] View code run time
+- [ ] Add competition between users with runtime.
+
+See the [open issues](https://github.com/othneildrew/Best-README-Template/issues) for a full list of proposed features (and known issues).
+
+<p align="right">(<a href="#top">back to top</a>)</p>
+
+
+
+<!-- CONTRIBUTING -->
+## Contributing
+
+Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.
+
+If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
+Don't forget to give the project a star! Thanks again!
+
+1. Fork the Project
+2. Create your Feature Branch (`git checkout -b feature/newFeature`)
+3. Commit your Changes (`git commit -m 'Add some newFeature'`)
+4. Push to the Branch (`git push origin feature/newFeature`)
+5. Open a Pull Request
+
+<p align="right">(<a href="#top">back to top</a>)</p>
+
+
+
+<!-- LICENSE -->
+## License
+
+Distributed under the MIT License. See `LICENSE.txt` for more information.
+
+<p align="right">(<a href="#top">back to top</a>)</p>
+
+
 
 
-```bash
-npm run dev
-# or
-yarn dev
-```
+<!-- CONTACT -->
+## Contact
 
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+Your Name - [@taintlesscupcake](https://instagram.com/taintless_cupcake) - [email](mailto:me@sungjin.dev)
 
 
-You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
+Project Link: [http://khuhub.khu.ac.kr/2021105619/learn_in_web](http://khuhub.khu.ac.kr/2021105619/learn_in_web)
 
 
-[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.
+<p align="right">(<a href="#top">back to top</a>)</p>
 
 
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
 
 
-## Learn More
 
 
-To learn more about Next.js, take a look at the following resources:
+<!-- ACKNOWLEDGMENTS -->
+## Acknowledgments
 
 
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+* []()
+* []()
+* []()
 
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+<p align="right">(<a href="#top">back to top</a>)</p>
 
 
-## Deploy on Vercel
 
 
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
 
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+<!-- MARKDOWN LINKS & IMAGES -->
+<!-- https://www.markdownguide.org/basic-syntax/#reference-style-links -->
+[contributors-shield]: https://img.shields.io/github/contributors/github_username/repo_name.svg?style=for-the-badge
+[contributors-url]: https://github.com/github_username/repo_name/graphs/contributors
+[forks-shield]: https://img.shields.io/github/forks/github_username/repo_name.svg?style=for-the-badge
+[forks-url]: https://github.com/github_username/repo_name/network/members
+[stars-shield]: https://img.shields.io/github/stars/github_username/repo_name.svg?style=for-the-badge
+[stars-url]: https://github.com/github_username/repo_name/stargazers
+[issues-shield]: https://img.shields.io/github/issues/github_username/repo_name.svg?style=for-the-badge
+[issues-url]: https://github.com/github_username/repo_name/issues
+[license-shield]: https://img.shields.io/github/license/github_username/repo_name.svg?style=for-the-badge
+[license-url]: https://github.com/github_username/repo_name/blob/master/LICENSE.txt
+[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=for-the-badge&logo=linkedin&colorB=555
+[linkedin-url]: https://linkedin.com/in/linkedin_username
+[product-screenshot]: images/screenshot.png

@@ -8,6 +8,7 @@ export const newPost = async (
     example,
     example,
     testinput,
     testinput,
     testoutput,
     testoutput,
+    difficulty,
 ) => {
 ) => {
     if (!auth.validateToken()) {
     if (!auth.validateToken()) {
         throw new Error("plz login");
         throw new Error("plz login");
@@ -19,6 +20,7 @@ export const newPost = async (
         example,
         example,
         testinput,
         testinput,
         testoutput,
         testoutput,
+        difficulty,
     });
     });
     if (response.status !== 200 && response.status !== 201) {
     if (response.status !== 200 && response.status !== 201) {
         throw new Error('Failed to create new post!');
         throw new Error('Failed to create new post!');

@@ -10,7 +10,8 @@ export default function New() {
         const example = form.example.value;
         const example = form.example.value;
         const testinput = form.testinput.value.split("\n");
         const testinput = form.testinput.value.split("\n");
         const testoutput = form.testoutput.value.split("\n");
         const testoutput = form.testoutput.value.split("\n");
-        const post = await newPost(title, explain, example, testinput, testoutput);
+        const difficulty = form.level.value;
+        const post = await newPost(title, explain, example, testinput, testoutput, difficulty);
         console.log(post);
         console.log(post);
     };
     };
     return (
     return (