A fully responsive and dynamic web app to present all products for a start-up called Zarafah

Overview

Zarafah

About Zarafah

Zarafah is a web application for a start-up that presents all products in a cool and efficient way. Logo wasn't made by me so you'll have to excuse its quality. :

  • Simple and soft design for front page: Used HTML, Vanilla CSS, Tailwind Css and JavaScript to come up with a smooth design and great functionalities.

Homepage Design

  • Looks cool on mobile too ;) , Nav bar in the header and footer transforms into dropdown menues for the best performance for Mobile and tablet:

Homepage Design

  • Great and clean functional title and body Search engine combined with Category and Author. Made with advanced eloquent queries. Features included (Title, body, category and author filtering):

Search Engine

  • Secure login and administration system supported by Laravel breeze, Supported actions are (Create, Update and Delete):

Login and Admin System

  • Easy product publishing and order submission:

Login and Admin System

  • Simple, fast routing engine: This is a Laravel project, so i've used Laravel 8 routing engine. Also routes are clean since i've used controllers for all routes.

zarafah-Routes

  • Used Mailchimp API for newsletter and Jotform API for form submission.

Please let me know of any feedback or suggestions :)

You can contact me on Twitter: https://twitter.com/Moose_Said

You might also like...
SARA: Dynamic licensing system with PHP

This license system allows you to dynamically create a license with Domain, IP address and Time.

This is Fully Working Net Banking Project Developed in PHP, HTML, JavaScript, CSS
This is Fully Working Net Banking Project Developed in PHP, HTML, JavaScript, CSS

Net Banking Project in PHP In this project i have develop real world net-banking project. This project is a best simulator for banking learners Featur

A dynamic Laravel Livewire component for tab forms
A dynamic Laravel Livewire component for tab forms

Livewire component that provides you with a tabs that supports multiple tabs form while maintaining state.

QuidPHP/Core is a PHP library that provides an extendable platform to create dynamic applications

QuidPHP/Core About QuidPHP/Core is a PHP library that provides an extendable platform to create dynamic applications. It is part of the QuidPHP packag

Unified sample web app. The easy way to learn web frameworks.
Unified sample web app. The easy way to learn web frameworks.

Notejam The easy way to learn web frameworks Do you know framework X and want to try framework Y? The easy way to start with a new framework is to com

Full symfony website application cms + app all in one
Full symfony website application cms + app all in one

Symfony Web App All in one cms website + Inventori Invoice Accounting Application A new modern web app with content management system for build websit

An open source self hosted notes and bookmarks taking web app.
An open source self hosted notes and bookmarks taking web app.

Benotes An open source self hosted web app for your notes and bookmarks side by side. This project is currently in Beta. You may encounter bugs or err

Retrieve MySejahtera App's data from MySejahtera API and show to users via web browser. Written in PHP
Retrieve MySejahtera App's data from MySejahtera API and show to users via web browser. Written in PHP

MySejahtera-PHP-Web Retrieve MySejahtera App's data from MySejahtera API and show to users via web browser. Written in PHP. Disclaimer This web app is

Simple web app to easily create landing pages by dragging and dropping prebuilt blocks
Simple web app to easily create landing pages by dragging and dropping prebuilt blocks

Drag & Drop landing page builder made with Laravel 8, Vue.js 3 and Tailwind CSS

Comments
  • Tests with Pest PHP

    Tests with Pest PHP

    Hello Mostafa,

    Congratulations on your project and your journey. Very good project presentation!

    I got to know about you in Laravel Daily and wanted to contribute with your project.

    There are some interesting changes on this Pull Request: https://github.com/MooseSaeed/Zarafah/pull/1. Do you know how what Pull Requests are and how to manage them? If not, just comment!

    My Pull Request is about automated tests.

    Tests can be a controversial topic, people have their own opinion about it. Me, myself, I wish I was introduced to testing in my first day, when I started as a developer.

    I believe tests save time, headache, improve quality and makes maintenance easier.

    It is virtually impossible for you to test different things every time you make a change in your application. How do you know if your new code did not break some other feature? We do not have time to test every single page or rule of our applications when new code is added.

    For this, we have automated tests.

    My approach is to test whatever is critical to my application. For example, if I have a blog system, I want to make sure a user can create, update, view, and delete a post. I want to guarantee that guests cannot create posts or view admin pages.

    These are the tests I would start to write, and I did write some of

    These are the tests currently running in your application. I have created the PostTest and RouteTest.

    My test framework of choice is Pest PHP.

    To run tests, you can type ./vendor/bin/pest in your Terminal (or composer test).

    CleanShot 2022-01-23 at 13 06 49@2x

    Green tests mean everything is okay, yellow is skipped and red is a failed test.

    For example,

    This test visits your home page and verifies that it loads. (Status 200 means OK, page loads)

    test('Home page loads', function () {
        //Requests the page
        $response = $this->get(route('home'));
    
        //Page could be loaded
        $response->assertStatus(200);
    });
    

    According to your rule, only the user MooseS94 can access the Dashboard. As mentioned in the PR #1, this logic could/should be modified, but let's say this is the final objective. I wrote a test for that:

    test('Dashboard: Random user can NOT access dashboard', function () {
    
        // Create an user for this test
        $user = User::factory()->create(['username' => 'random1234']);
    
        $response = $this->actingAs($user)
            ->get(route('dashboard'));
        
        //403 Forbidden access
        $response->assertStatus(403);
    });
    

    In the test above, we verified that a user random1234 will not be able to access the Dashboard.

    And in the next test, we verified that MooseS94 can do it.

    test('Dashboard: MooseS94 can access dashboard', function () {
    
        // Create MooseS94 for this test
        $user = User::factory()->create(['username' => 'MooseS94']);
    
        $response = $this->actingAs($user)
            ->get(route('dashboard'));
    
        $response->assertStatus(200);
    });
    

    Now, how can you make sure these tests are working?

    Just for an exercise, modify your MustBeAdmin middleware to:

        public function handle(Request $request, Closure $next)
        {
    
           if (auth()->user()?->username != 'Dan1234') {
    
                abort(Response::HTTP_FORBIDDEN);
            }
    
            return $next($request);
        }
    

    Now, only dansysanalyst can access the Dashboard, but the test is written to verify if MooseS94 can do it.

    So, it will make your test fail:

    CleanShot 2022-01-23 at 13 23 54@2x

    You can follow this playlist to see a bit more about tests:

    https://www.youtube.com/watch?v=gTU-y6HlmzU&list=PLNXrjfSe7qHncCyQYOqJBTsTbYPotMaZ8&ab_channel=MichaelDyrynda

    I wish you the all best,

    Greetings

    Dan

    opened by dansysanalyst 3
  • Changes

    Changes

    run php artisan init:project and you will see some majic there. Also added form requests . you can update rest of requests like this. Many more things to be added

    opened by nipunTharuksha 1
Owner
Mostafa Said
A Business Operations Specialist at VodafoneGroup in the morning. A full-stack web developer at night.
Mostafa Said
A Responsive Web Chat App Using Php , MySql and JavaScript

Web-Chat-App A Responsive Web Chat App Using Php , MySql and JavaScript Prerequisites XAMPP [Php Runtime Environment] click HERE To Download XAMPP Set

Luttapi 4 Jul 12, 2022
Instagram automation represents the use of third-party software to manage your account, carry out tasks and/or interact with users without a human present. Bulit in Laravel Framework

How to Deploy laravel project to heroku Video Link : https://youtu.be/7Nq_a2QiaHo Home Page Login Page Dashboard Page About Laravel Laravel is a web a

null 1 Dec 3, 2021
Rafa Cake and Bakery is a web-based application project that aims to introduce Rafa Cake and Bakery, introduce what products are sold and can also order them via Whatsapp.

Rafa-cake-and-bakery Rafa Cake and Bakery is a web-based application project that aims to introduce Rafa Cake and Bakery, introduce what products are

Aan Evian Nanda 2 Jun 19, 2022
Mofhy is a secure, fast and responsive client area for managing MyOwnFreeHost accounts and ssl certificates.

Mofhy is an open-source MyOwnFreeHost client area for managing accounts and ssl certificates. It has easy to use features much like the WHMCS Digit UI interface

Mofhy 12 Dec 15, 2022
A powerful and responsive blog system powered by laravel 5.5.

Powerful and responsive blog system powered by laravel 5.5. Click https://lufficc.com/blog to view live demo. Xblog 中文 README | Docs This blog is for

Congcong Li 924 Nov 18, 2022
All in one ban system web (light version for all)

All in one - Ban system web (light version) All in one ban system web (light version for all) This database of players who violate or use third-party

Awesomium Team LLC 1 May 3, 2022
Simple Dynamic DNS Web management self-hosting. Run over dnsmasq.

MyDDNS [BETA] Simple Dynamic DNS Web management self-hosting. It use dnsmasq. It was inspired on duckdns.org. Preparation You need root access to a se

Iván Eixarch 4 Jul 6, 2022
Workout application with fully functional Frontend and Backend.

Fit_Me_Application About Application: This FIT-ME management system is an easy way to use gym and health membership system. It can help to keep the re

Talha 3 Feb 20, 2022
LaraEstimate is a complete Dynamic Estimates/Quotes System made with Laravel 7 and VueJS.

LaraEstimate LaraEstimate is a complete Dynamic Estimates/Quotes System made with Laravel 7 and VueJS. The system has the following features: Allows t

Tiago S. P. Rodrigues 133 Dec 12, 2022
Dynamic photo package for blog posts and other features, integrating CKEditor Smart WYSIWYG

Dynamic Photo Dynamic Photo is a package to assist in integration with CKEditor, a powerful WYSIWYG. With the package it is possible to send photos dy

Michael Frank 7 Jul 18, 2022