The job data model could be defined by its title, content, categories, location, date, and email. For the content, we could us CKEditor by downloading it at https://ckeditor.com/ . As the result, we could create a form mapping with this data model as below:

 

<!--view/admin/job.ejs-->
<link rel="stylesheet" href="/styles/admin/job.css" />
<script src="/scripts/ckeditor/ckeditor.js"></script>

<section class="Job">
    <form action="/admin/job" method="post">
        <input type="text" name="title" required placeholder="ចំណង​ជើង" />
        <textarea name="content" id="editor">​​​​​​​​​​​​​​</textarea>
        <input type="text" name="categories" required placeholder="ជំពូក" />
        <div class="wrapper">
            <select name="category" required>
                <option>test</option>
            </select>
            <input type="text" name="location" required placeholder="ទីកន្លែង" />
            <input type="datetime-local" name="datetime" required />
            <input type="email" name="email" required placeholder="Email" />
            <input type="submit" value="​​​​​​​​​​​​​បញ្ជូន" />
        </div>
    </form>
</section>
<script src="/scripts/ckeditor/config.js"></script>

 

/* static/styles/admin/job.css */
.Job form .ck-editor__editable{
    min-height: 300px;
    color: black;
}

.Job form input,.Job form select{
    width: 100%;
    font: var(--body-font);
    padding: 5px 10px;
}

.Job form .wrapper{
    display: grid;
    grid-template-columns: auto auto auto auto auto;
}

 

 

GitHub: https://github.com/Sokhavuth/khmerweb-job

Heroku: https://khmerweb-job.herokuapp.com