fcckarachi/fcckarachi.github.io

A landing page for freeCodeCampKarachi

---

Official Landing page for freeCodeCampKarachi

This is the official landing page for freeCodeCampKarachi which is one of the Local Study Groups of freeCodeCamp.org an Online E-learning platform. This group is run by some of the very enthusiastic members of the group itself who are like minded and share the same goal of supporting, guiding and connecting newcomers and experienced developers alike.

We Love to contribute Open Source and encourage other developers to do the same. Even this page has some very easy open issues for first timers to help them create their first Pull Request.

If you are looking forward to contribute, You can do so by following these Guidelines.

---

Running the Project

Prerequisites

1. Install Node.js (node) latest version.

2. Verify that you're running node version 7 or above and npm version 5 or above.

   node -v
   v9.3.0
   
   npm -v
   5.5.1
   

3. Make sure you have Git Installed in your system

Fork this Repo

1. Fork this repository

Clone it locally

1. Open a Terminal / Command Line / Bash Shell and navigate to a project directory where you want to copy this project.

   cd yourProjectDirectory
   

2. Run below command in your terminal.

   git clone https://github.com/yourUsername/fcckarachi.github.io.git
   

   (make sure to replace yourUsername with your GitHub Username), This will download the entire fcckarachi.github.io repo to your projects directory.

Install Dependencies

1. cd into the base directory of your fcckarachi project.

2. Install the application dependencies.

   npm install
   

Running the App

This command serves the app at http://localhost:1234 and provides basic URL routing for the app:

npm start

Want to Contribute?

1. Join fcckarachi Organization on github.
2. Please follow these Guidelines in order to contribute to this repo.

Tools used to build this page

• Bundled using Parcel.js
• Styled using Materialize.css
• Deployed using TravisCI
• Style guide provided by freeCodeCamp
• Section Separator used from this CodePen
• Inspired by freeCodeCampVienna
• Designed using Brain.js & Creativity.js

Any Questions?

Feel free to get in touch with us [email protected]

fcckarachi.github.io's Issues

Eliminate Memory Leak in Carousal

We've found a memory leak in JS setInterval, and finding an optimized solution to eliminate this leak.

Adding padding to Tiles in Goals section.

While on mobiles with bigger font sizes the Tiles in Goals section don't seem to have a good padding and are almost touching the bottom border, a padding of around 10px; might do the job There is already some padding applied.

Feel free to try your solution and ask for help in the comments. Also read this guide before trying to contribute.

Implement auto rotate feature on Partners Carousel

There is a carousel in our Partners section, We need to make it rotate automatically on a certain timeout.

Look at it's documentation over here. And implement the necessary code to do it.

Feel free to ask questions in the comments and read the contributing doc before moving forward.

Images to be converted to WebP format.

In order to increase the page load speed & lighthouse score we need to convert all images to WebP format so that they can load faster. Please ask for help and guidance if needed via comments.

For conversion of Images to WebP format, you can download the tool for your relevant platform:

• Windows 32bit
• Windows 64bit
• Linux 32bit
• Linux 64bit
• Mac

Add BlackFire Host Logo as our Sponsor/Partner.

We need to add Black fire host logo as our sponsor. Please make sure you download the logo from the given link and place in the right folder.

Logo Link: https://blackfirehost.com/templates/hostify/img/android-icon-192x192.png
Website Url: https://blackfirehost.com/index.php

Please read Contributing Document so that we can follow best practices.

Apply rel="noopener" to anchor tags

If you don't already know then you must be wondering what the hell is this property? well read the docs on it here https://developers.google.com/web/tools/lighthouse/audits/noopener

We need to apply this property to all our anchor tags to improve performance ans security.

If you need help, then feel free to as in comments.

I would Like to join this organization.

Add GitHub & Social Links for contributors and members.

I will suggest adding GitHub links for Contributors and Core Members. As of now there is only a picture and some text.

Change the cycle duration of partners carousel.

The partners carousel is currently rotating at 1 sec interval, change it to 2.5 secs to make it look good and responsive to user actions.

Read our contributing guide thoroughly before going forward with the issue.

Feel free to ask any questions regarding the issue in the comments below.

Re-position Menu & Menu button on right side.

Currently the Menu and the button on mobile screens is shown on left side, But it's should be on the right side to improve User experience (UX), We have used http://materializecss.com/ library to built this landing page. Read it's documentation and apply necessary changes.

Ask for help in the comments of you need any.

Add a section for upcoming events

It would be a great idea to add upcoming events' schedules etc. on the website. We would still have events created first hand on the group which will be automatically fetched on the website through facebook's graph api.

Correction required in some of the text in landing page.

At some places we mistakenly wrote FreeCodeCamp with uppercase f we need it to be changed to lower case as the original freeCodeCamp name. Make sure you have changed it at all the places necessary.

Follow our contributing guidelines over here.

Feel free to ask question regarding the issue in comments below.

Lazy Load images.

We need to lazy load the images to avoid unnecessary server request for initial page load, This will help decrease page load time and make it faster.

A light weight library for that is available here https://github.com/dinbror/blazy

Please ask for help in the comments if needed.