Published on

Southside

Authors
  • avatar
    Name
    Ridha Majid
    Twitter
cover

Direct link to Southside.

Real estate list portofolio website used for buying and selling. This website are focuses more for selling or renting apartement or house.

We used a technologies such as :

  • React/nextJs as a javascript library.
  • Airtable for the database.
  • Tailwind for the CSS library.
  • Vercel for the hosting.

We used React because it is one of the most popular Javascript libraries, so it would be easy to maintain along with NextJs.For the backend, we used Airtable to make it easy and familiar because the concept of an Airtable database is similar to a spreadsheet. Tailwind is very useful, making it easy for us to build a component. And we deployed a website on Vercel.

Home page

home-screenshot

On the home page we have:

  • Hero with some text on it.
  • Product showcase.
  • Product card,
    • rent or sell label,
    • product title,
    • product image,
    • location of the product,
    • specification product ,
    • the price of product,
  • filter Rent or buy .
  • Direct button to go to page for the specific product.

List product page

product-showcase

On the Product page we have:

  • Filter.
    • Input text filter, used for find the name or the location of the product.
    • Akad filter, you can choose between 'buy' or 'rent'.
    • Range price filter, to filter the product for the prices that you desire.
  • Product showcase.

Product detail page

product-detal

On Product detail page we have:

  • Carousel Image.
  • Product title.
  • Share button.
    • Facebook,
    • Twitter,
    • Telegram,
    • WhatsApp,
    • Line,
  • Product specification.
  • Description of the Product.
  • Product price.
  • Button to be directed to the sales contact person (WhatsApp).

Contact page

contact-detal

On Product Contact page we have:

  • Description about Us.
  • input contact to send direcly to the sales email.
  • Our Social media.

Primary section

contact-detal

On Primary section we ussed for direct to the Primary project list.