Code Monkey home page Code Monkey logo

highpoint-masjid's Introduction

Highpoint Masjid Website

This project was bootstrapped with Create React App. It hosts the code used to build the Highpoint Masjid in Highpoint, West Seattle. This website will be used as a templated to build other free mosque websites in the future. It is loosely based on Mosque Screen's Mosque website but converted to react and having some lifecycle improvments added to make it easy for mosques to host their free website on GitHub Pages.

Some of those improvements include the following:

  1. The addition of GitHub actions pipeline to build and deploy the website to GitHub pages. For more information on that check out this blog for more information
  2. Conversion of the Next.js app to React
  3. Movement of all data to the data files so user only needs up update the data files for their needs
  4. Addition of a proper nav bar
  5. Addition of an events page
  6. Update data file to support new paradigm

Getting Started

First fork the repo by clicking on the fork button at the top right then clone the website (star it too if you like it while you're at it ๐Ÿ˜‰)

git clone https://github.com/<your username>/highpoint-masjid

Install the required packages to run it locally

npm install

Run it locally to test it out

npm run start

Deploy your mosque website

Update the src\data\mosques.yml file as required. Each page will require its own entry in content_sections and pages part of the database

Convert the yml data to json by running

npm run release

commit and push your changes to your GitHub repo

Please note, you will need to configure your repo to run GH pages by using the instructions in this blog

highpoint-masjid's People

Contributors

mosabami avatar

Watchers

 avatar

Forkers

sajjadmurtaza

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.