Tokoku – Web Programming projects

Tokoku is an online grocery store company profile website.  The website provide an easy access to grocery shopping with many choices of products such as vegetables, meats, drinks, fruits, and so on.

The website has CMS (Content Management System) as a back-end to manage the content of the website. The website implements MVC (Model – View – Controller) model and CSS based design (we used bootstrap for the design).

The website has 2 functionalities. For the website functions (front-end), these are the features that we have in our website:

  • Home (Slideshow images, Highlight of Product, Current News)
    Screenshot (38)

    Header, Menu Bar, Slide show images

    Screenshot (39)

    Highlight of Products and News

  • Log-in, Register
    Screenshot (44)

    Register page

    Screenshot (45)

    Login page

  • Footer (address, phone number, social media links)



  • About Us

    About Us page

    About Us page

  • Products
    • Category of products
    • Search products
    • Detail information of each products
      Screenshot (41)

      Product page

      Screenshot (42)

      Detail of the product

  • News
    • Sort by date

      Screenshot (43)

      News, can be sorted based on the date in ascending or descending order

    • Search news
    • Comments and total comments
    • Leave comment for registered user

      Detail of the news, following by the comments and total comments. Logged-in user can leave comment

      Detail of the news, following by the comments and total comments. Logged-in user can leave comment

For the admin functions (back-end), our website enables the admin to:

  • Manage user
    • See list of user and last login history
    • Create, edit, delete user
    • Modify user access (admin or user)

      Screenshot (49)

      Admin can see list of user and last login history, edit user access, or delete user from database

  • Manage main function
    • Add or Edit social media links
    • Add or Edit address & phone number

      Screenshot (50)

      Admin can add new social media links or contacts, edit existing social media links or contacts, or delete.

  • Manage slideshow
    • Change image sequence of the slide show

      Screenshot (50)

      Admin can change the sequence of the slideshow

  • Manage page (we implement Rich Text Editor for this function)
    • Edit or delete the static page (About Us page)
    • Edit or delete dynamic pages:
      • Add, edit, or delete products from Product page
      • Add, edit, or delete news from News page

        Screenshot (52)

        Admin can manage content of the dynamic/static page. Example in the picture is managing product page (editting product’s detail information) using Rich Text Format editor  (NicEdit) that is embedded into the website.

  • Manage comments
    • View list of comments
    • Delete comments

      Screenshot (53)

      Admin can see lists of comments and delete comment.

Leave a Reply

Your email address will not be published. Required fields are marked *