diff --git a/.ci/build.sh b/.ci/build.sh
index 1f01164d..56c2be06 100755
--- a/.ci/build.sh
+++ b/.ci/build.sh
@@ -27,6 +27,7 @@ python manage.py fetch_deployed_data _site $ISSUES_JSON \
 
 python manage.py migrate
 python manage.py import_contributors_data
+python manage.py create_org_cluster_map_and_activity_graph org_map
 python manage.py import_issues_data
 python manage.py import_merge_requests_data
 python manage.py create_config_data
diff --git a/.coafile b/.coafile
index edfbf0ec..d2942cee 100644
--- a/.coafile
+++ b/.coafile
@@ -1,6 +1,6 @@
 [all]
 files = **.py, **.js, **.sh
-ignore = .git/**, **/__pycache__/**, gci/client.py, */migrations/**, private/*
+ignore = .git/**, **/__pycache__/**, gci/client.py, */migrations/**, private/*, openhub/**, **/leaflet_dist/**
 max_line_length = 80
 use_spaces = True
 preferred_quotation = '
@@ -42,6 +42,7 @@ files = static/**/*.js
 bears = JSHintBear
 allow_unused_variables = True
 javascript_strictness = False
+environment_jquery = True
 
 [all.yml]
 bears = YAMLLintBear
@@ -58,7 +59,7 @@ shell = bash
 # for use by other organizations.
 files = **
 # .coverage crashes AnnotationBear
-ignore += .coafile, *requirements.txt, .travis.yml, LICENSE, .nocover.yaml, .moban.yaml, .moban.dt/community-*.jj2, public/**, _site/**, .ci/check_moban.sh, .coverage
+ignore += .coafile, *requirements.txt, .travis.yml, LICENSE, .nocover.yaml, .moban.yaml, .moban.dt/community-*.jj2, public/**, _site/**, .ci/check_moban.sh, .coverage, static/js/main.js
 bears = KeywordBear
 language = python 3
 keywords = coala
diff --git a/.gitignore b/.gitignore
index 6ca4d51a..2592fe2b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -63,6 +63,7 @@ coverage.xml
 *.log
 local_settings.py
 db.sqlite3
+db.sqlite3-journal
 
 # Flask stuff:
 instance/
@@ -272,6 +273,7 @@ flycheck_*.el
 
 # Session
 Session.vim
+Sessionx.vim
 
 # Temporary
 .netrwhist
@@ -429,11 +431,7 @@ DerivedData/
 *.perspectivev3
 !default.perspectivev3
 
-## Xcode Patch
-*.xcodeproj/*
-!*.xcodeproj/project.pbxproj
-!*.xcodeproj/xcshareddata/
-!*.xcworkspace/contents.xcworkspacedata
+## Gcc Patch
 /*.gcno
 
 # Eclipse rules
diff --git a/.moban.yaml b/.moban.yaml
index 574c2d69..f9db2b3c 100644
--- a/.moban.yaml
+++ b/.moban.yaml
@@ -9,13 +9,13 @@ packages:
   - gci
   - gsoc
   - gamification
-  - log
+  - ci_build
   - meta_review
   - model
-  - twitter
   - unassigned_issues
 
 dependencies:
+  - getorg~=0.3.1
   - git+https://gitlab.com/coala/coala-utils.git
   - git-url-parse
   - django>2.1,<2.2
diff --git a/.nocover.yaml b/.nocover.yaml
index 987773ce..4757eb64 100644
--- a/.nocover.yaml
+++ b/.nocover.yaml
@@ -8,11 +8,10 @@ nocover_file_globs:
   - community/git.py
   - gci/*.py
   - gsoc/*.py
-  - log/*.py
+  - ci_build/*.py
   - meta_review/handler.py
   - model/*.py
   - openhub/*.py
-  - twitter/*.py
   # Optional coverage. Once off scripts.
   - inactive_issues/inactive_issues_scraper.py
   - unassigned_issues/unassigned_issues_scraper.py
diff --git a/.travis.yml b/.travis.yml
index 61015858..255cb955 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,5 +1,5 @@
 language: python
-python: 3.6
+python: 3.6.3
 
 cache:
   pip: true
diff --git a/activity/scraper.py b/activity/scraper.py
index 069bc668..9d8fc794 100644
--- a/activity/scraper.py
+++ b/activity/scraper.py
@@ -136,7 +136,7 @@ def get_data(self):
         return self.data
 
 
-def activity_json(request):
+def activity_json(filename):
 
     org_name = get_org_name()
 
@@ -152,4 +152,5 @@ def activity_json(request):
     real_data = Scraper(parsed_json['issues'], datetime.datetime.today())
     real_data = real_data.get_data()
 
-    return HttpResponse(json.dumps(real_data))
+    with open(filename, 'w+') as f:
+        json.dump(real_data, f, indent=4)
diff --git a/ci_build/view_log.py b/ci_build/view_log.py
new file mode 100644
index 00000000..8c476ae3
--- /dev/null
+++ b/ci_build/view_log.py
@@ -0,0 +1,131 @@
+import re
+import json
+import os
+import sys
+
+from django.views.generic import TemplateView
+
+from community.views import get_header_and_footer
+from community.git import (
+    get_org_name,
+    get_owner,
+    get_deploy_url,
+    get_upstream_deploy_url
+)
+
+
+class BuildLogsView(TemplateView):
+    template_name = 'build_logs.html'
+
+    def copy_build_logs_json(self, ci_build_jsons):
+        """
+        :param ci_build_jsons: A dict of directories path
+        :return: A boolean, whether the build file is copied
+        """
+        if os.path.isfile(ci_build_jsons['public_path']):
+            if sys.platform == 'linux':
+                os.popen('cp {} {}'.format(
+                    ci_build_jsons['site_path'],
+                    ci_build_jsons['public_path']))
+                os.popen('cp {} {}'.format(
+                    ci_build_jsons['site_path'],
+                    ci_build_jsons['static_path']))
+            else:
+                os.popen('copy {} {}'.format(
+                    ci_build_jsons['site_path'],
+                    ci_build_jsons['public_path']))
+                os.popen('copy {} {}'.format(
+                    ci_build_jsons['site_path'],
+                    ci_build_jsons['static_path']))
+            return True
+        return False
+
+    def create_and_copy_build_logs_json(self, logs, level_specific_logs):
+        """
+        Create a build logs detailed json file in ./_site directory and copy
+        that file in the ./static and ./public/static directories
+        :param logs: A list of all lines in build log file
+        :param level_specific_logs: A dict containing logs divided in their
+        respective categories
+        :return: A boolean, whether the files were copied or not
+        """
+        ci_build_jsons = {
+            'site_path': './_site/ci-build-detailed-logs.json',
+            'public_path': './public/static/ci-build-detailed-logs.json',
+            'static_path': './static/ci-build-detailed-logs.json'
+        }
+        with open(ci_build_jsons['site_path'], 'w+') as build_logs_file:
+            data = {
+                'logs': logs,
+                'logs_level_Specific': level_specific_logs
+            }
+            json.dump(data, build_logs_file, indent=4)
+        return self.copy_build_logs_json(ci_build_jsons)
+
+    def get_build_logs(self, log_file_path):
+        """
+        :param log_file_path: build logs file path
+        :return: a tuple of two where the first element in tuple refers to
+        a list of build logs in the file, and the second element is a dict
+        which categorizes the build logs into 5 categories - INFO, DEBUG,
+        WARNING, ERROR nad CRITICAL
+        """
+        log_lines = []
+        log_level_specific_lines = {
+            'INFO': [],
+            'DEBUG': [],
+            'WARNING': [],
+            'ERROR': [],
+            'CRITICAL': []
+        }
+        with open(log_file_path) as log_file:
+            previous_found_level = None
+            for line in log_file:
+                log_lines.append(line)
+                levels = re.findall(r'\[[A-Z]+]', line)
+                if levels:
+                    level = levels[0]
+                    level = previous_found_level = level[1:-1]
+                    log_level_specific_lines[level].append(line)
+                elif previous_found_level:
+                    log_level_specific_lines[previous_found_level].append(
+                        line)
+        return log_lines, log_level_specific_lines
+
+    def check_build_logs_stored(self):
+        """
+        Check whether the build logs json file is copied to _site and public
+        directories or not
+        :return: A Boolean
+        """
+        log_file_path = './_site/community.log'
+        log_file_exists = os.path.isfile(log_file_path)
+        if log_file_exists:
+            logs, level_specific_logs = self.get_build_logs(log_file_path)
+            return self.create_and_copy_build_logs_json(logs,
+                                                        level_specific_logs)
+        return False
+
+    def get_build_info(self):
+        """
+        Get the information about build, like who deployed the website i.e.
+        owner, name of the organization or user etc.
+        :return: A dict having information about build related details
+        """
+        data = {
+            'Org name': get_org_name(),
+            'Owner': get_owner(),
+            'Deploy URL': get_deploy_url(),
+        }
+        try:
+            data['Upstream deploy URL'] = get_upstream_deploy_url()
+        except RuntimeError:
+            data['Upstream deploy URL'] = 'Not found'
+        return data
+
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        context = get_header_and_footer(context)
+        context['build_info'] = self.get_build_info()
+        context['logs_stored'] = self.check_build_logs_stored()
+        return context
diff --git a/community/forms.py b/community/forms.py
new file mode 100644
index 00000000..729abded
--- /dev/null
+++ b/community/forms.py
@@ -0,0 +1,295 @@
+from datetime import datetime
+
+from django import forms
+
+from community.git import get_org_name
+
+TODAY = datetime.now().today()
+ORG_NAME = get_org_name()
+
+
+class JoinCommunityForm(forms.Form):
+
+    github_username = forms.CharField(
+        max_length=50, label='GitHub Username',
+        widget=forms.TextInput(
+            attrs={
+                'placeholder': 'Make sure to NOT enter your github profile url',
+                'autocomplete': 'off'
+            }
+        )
+    )
+    gh_first_repo = forms.URLField(
+        required=False, label='GitHub Personal Repository',
+        widget=forms.URLInput(
+            attrs={
+                'placeholder': 'A valid github url of your personal repository',
+                'autocomplete': 'off'
+            }
+        )
+    )
+    gh_git_training_exercise = forms.URLField(
+        required=False, label='From which GitHub repository you have done git'
+                              ' training?',
+        widget=forms.URLInput(
+            attrs={
+                'placeholder': 'A valid github url of git training repository',
+                'autocomplete': 'off'
+            }
+        )
+    )
+    gh_most_contributed_repo = forms.URLField(
+        required=False,
+        label="GitHub Repository to which you've contributed most!",
+        widget=forms.URLInput(
+            attrs={
+                'placeholder': 'A valid github public repository url',
+                'autocomplete': 'off'
+            }
+        )
+    )
+
+    gitlab_user_id = forms.IntegerField(
+        label='GitLab User ID',
+        widget=forms.NumberInput(
+            attrs={
+                'placeholder': 'Make sure to NOT enter your gitlab profile url',
+                'autocomplete': 'off'
+            }
+        )
+    )
+    gl_first_repo_id = forms.IntegerField(
+        required=False, label='GitLab Personal Project ID',
+        widget=forms.NumberInput(
+            attrs={
+                'placeholder': 'Your personal gitlab project ID',
+                'autocomplete': 'off'
+            }
+        )
+    )
+    gl_git_training_exercise = forms.IntegerField(
+        required=False, label='From which GitLab project you have done git'
+                              ' training?',
+        widget=forms.NumberInput(
+            attrs={
+                'placeholder': 'A valid project ID of Git training project',
+                'autocomplete': 'off'
+            }
+        )
+    )
+    gl_most_contributed_repo_id = forms.IntegerField(
+        required=False,
+        label="GitLab Project to which you've contributed most!",
+        widget=forms.NumberInput(
+            attrs={
+                'placeholder': 'A valid ID of gitlab public project',
+                'autocomplete': 'off',
+            }
+        )
+    )
+
+
+class CommunityGoogleForm(forms.Form):
+    user = forms.CharField(
+        max_length=50, label='GitHub Username',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    title = forms.CharField(
+        max_length=100, label='Title',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    description = forms.CharField(
+        max_length=1000, label='Form Description', required=False,
+        widget=forms.Textarea(attrs={'autocomplete': 'off'})
+    )
+    url = forms.URLField(
+        label='Google Form URL',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    expiry_date = forms.DateTimeField(
+        label='Expiry date and time', required=False,
+        help_text='DateTime Format should be YYYY-MM-DD HH:MM:SS',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+
+
+class CommunityEvent(forms.Form):
+    user = forms.CharField(
+        max_length=50, label='GitHub Username',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    title = forms.CharField(
+        max_length=300, label='Event Title',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    description = forms.CharField(
+        max_length=1000, label='Event Description', required=False,
+        widget=forms.Textarea(attrs={'autocomplete': 'off'})
+    )
+    start_date_time = forms.DateTimeField(
+        label='Event occurrence date and time(in UTC)',
+        help_text='DateTime Format should be YYYY-MM-DD HH:MM:SS',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    end_date_time = forms.DateTimeField(
+        label='Event end date and time(in UTC)', required=False,
+        help_text='DateTime Format should be YYYY-MM-DD HH:MM:SS',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+
+
+class OrganizationMentor(forms.Form):
+    user = forms.CharField(
+        max_length=50, label='GitHub Username',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    year = forms.ChoiceField(
+        choices=[(TODAY.year, TODAY.year), (TODAY.year + 1, TODAY.year + 1)],
+        label='Mentoring Year', widget=forms.Select()
+    )
+    program = forms.ChoiceField(
+        choices=[('GSoC', 'Google Summer of Code'), ('GCI', 'Google Code-In')],
+        label='Mentoring Program'
+    )
+
+
+class GSOCStudent(forms.Form):
+    user = forms.CharField(
+        max_length=50, label='GitHub Username',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    year = forms.IntegerField(
+        label='Participation year',
+        widget=forms.NumberInput(attrs={'autocomplete': 'off'})
+    )
+    project_topic = forms.CharField(
+        max_length=300, label='GSoC Project Topic',
+        help_text='Should be same as on GSoC Website!',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    project_desc = forms.CharField(
+        max_length=2000, label='Project Description',
+        widget=forms.Textarea(attrs={'autocomplete': 'off'})
+    )
+    accepted_proposal = forms.URLField(
+        label='Accepted Proposal URL',
+        help_text='The proposal you submitted during GSoC Program!',
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    cEP = forms.URLField(
+        label='Org Enhancement Proposal Merge Request', required=False,
+        help_text='For example, in {org} we have cEP({org} Enhancement '
+                  'Proposal)'.format(org='coala'),  # Ignore KeywordBear
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    project_url = forms.URLField(
+        label='GSoC Project URL',
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    mentors = forms.CharField(
+        max_length=200, label='Project Mentors',
+        help_text='Separate name of mentor by comma(,)',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    image = forms.URLField(
+        label='Personal Image URL', required=False,
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+
+
+class AssignIssue(forms.Form):
+    user = forms.CharField(
+        max_length=50, label='GitHub Username',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    hoster = forms.ChoiceField(
+        choices=[('github', 'GitHub'), ('gitlab', 'GitLab')], label='Hoster'
+    )
+    repository_url = forms.URLField(
+        label='Repository URL',
+        help_text=f'For example, https://github.com/{ORG_NAME}/community/',
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    issue_number = forms.IntegerField(
+        label='Issue Number',
+        widget=forms.NumberInput(attrs={'autocomplete': 'off'})
+    )
+    requested_user = forms.CharField(
+        max_length=50, label='GitHub Username',
+        widget=forms.TextInput(attrs={'autocomplete': 'off', 'hidden': True})
+    )
+
+
+class NewcomerPromotion(forms.Form):
+    github_username = forms.CharField(
+        max_length=50, label='GitHub Username',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    gitlab_user_id = forms.IntegerField(
+        label='GitLab User ID',
+        widget=forms.NumberInput(attrs={'autocomplete': 'off'})
+    )
+    project_web_url = forms.URLField(
+        label='Personal Project URL',
+        help_text="A project in which you've added .coafile and build it!",
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    build_file_relative_path = forms.CharField(
+        label='Build File',
+        help_text='For example, if integrated Travis CI, provide '
+                  '/relative/path/to/travis.yml',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    coafile_relative_path = forms.CharField(
+        label='.coafile File',
+        help_text="Add 5 or more sections in '.coafile'! Provide "
+                  '/relative/path/to/.coafile',
+        widget=forms.TextInput(attrs={'autocomplete': 'off'})
+    )
+    gist_or_snippet_id = forms.IntegerField(
+        label='Gist or Snippet ID',
+        help_text='Paste your local build output to gist or snippet! Choose '
+                  'Gist, if personal project on GitHub else choose '
+                  'GitLab Snippet.',
+        widget=forms.NumberInput(attrs={'autocomplete': 'off'})
+    )
+    newcomer_solved_issue_web_url = forms.URLField(
+        label='Issue URL',
+        help_text=f'For example, https://github.com/{ORG_NAME}/community/'
+                  'issues/1',
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    newcomer_issue_related_pr = forms.URLField(
+        label='Merge Request URL',
+        help_text=f'For example, https://github.com/{ORG_NAME}/community'
+                  '/pulls/1',
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    newcomer_issue_pr_reviewed_url = forms.URLField(
+        label='Reviewed PR URL',
+        help_text=f'For example, https://github.com/{ORG_NAME}/community/'
+                  'pulls/2',
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    low_level_solved_issue_web_url = forms.URLField(
+        label='Issue URL',
+        help_text=f'For example, https://github.com/{ORG_NAME}/community/'
+                  'issues/1',
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    low_level_issue_related_pr = forms.URLField(
+        label='Merge Request URL',
+        help_text=f'For example, https://github.com/{ORG_NAME}/community'
+                  '/pulls/1',
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    low_level_issue_pr_reviewed_url = forms.URLField(
+        label='Reviewed PR URL',
+        help_text=f'For example, https://github.com/{ORG_NAME}/community/'
+                  'pulls/2',
+        widget=forms.URLInput(attrs={'autocomplete': 'off'})
+    )
+    request_created_by_user = forms.CharField(
+        max_length=50, label='GitHub Username',
+        widget=forms.TextInput(attrs={'autocomplete': 'off', 'hidden': True})
+    )
diff --git a/community/git.py b/community/git.py
index fabe06d8..7d5541fc 100644
--- a/community/git.py
+++ b/community/git.py
@@ -49,7 +49,7 @@ def get_config_remote(name='origin'):
     raise KeyError('No git remotes found')
 
 
-def get_remote_url():
+def get_remote_url(name='origin'):
     """Obtain a parsed remote URL.
 
     Uses CI environment variables or git remotes.
@@ -58,7 +58,7 @@ def get_remote_url():
     # It only sets the REPOSITORY_URL
     url = os.environ.get('REPOSITORY_URL')
     if not url:
-        remote = get_config_remote()
+        remote = get_config_remote(name)
         assert remote[0][0] == 'url'
         url = remote[0][1]
 
@@ -146,7 +146,7 @@ def get_upstream_repo():
     """Obtain the parent slug of the repository.
     """
     try:
-        remote = get_config_remote(name='upstream')
+        remote = get_remote_url(name='origin')
     except KeyError:
         remote = None
 
diff --git a/community/urls.py b/community/urls.py
index ed936b9d..a42078b6 100644
--- a/community/urls.py
+++ b/community/urls.py
@@ -5,17 +5,14 @@
 from django_distill import distill_url
 from django.conf.urls.static import static
 from django.conf import settings
-from django.views.generic import TemplateView
 
-from community.views import HomePageView, info
-from gci.views import index as gci_index
+from community.views import HomePageView, JoinCommunityView
+from gci.views import GCIStudentsList
 from gci.feeds import LatestTasksFeed as gci_tasks_rss
-from activity.scraper import activity_json
-from twitter.view_twitter import index as twitter_index
-from log.view_log import index as log_index
-from data.views import index as contributors_index
-from gamification.views import index as gamification_index
-from meta_review.views import index as meta_review_index
+from ci_build.view_log import BuildLogsView
+from data.views import ContributorsListView
+from gamification.views import GamificationResults
+from meta_review.views import ContributorsMetaReview
 from inactive_issues.inactive_issues_scraper import inactive_issues_json
 from openhub.views import index as openhub_index
 from model.views import index as model_index
@@ -82,22 +79,10 @@ def get_organization():
         distill_file='index.html',
     ),
     distill_url(
-        'info.txt', info,
-        name='index',
-        distill_func=get_index,
-        distill_file='info.txt',
-    ),
-    distill_url(
-        r'static/activity-data.json', activity_json,
-        name='activity_json',
-        distill_func=get_index,
-        distill_file='static/activity-data.json',
-    ),
-    distill_url(
-        r'activity/', TemplateView.as_view(template_name='activity.html'),
-        name='activity',
+        r'^join/', JoinCommunityView.as_view(),
+        name='join-community',
         distill_func=get_index,
-        distill_file='activity/index.html',
+        distill_file='join/index.html',
     ),
     distill_url(
         r'gci/tasks/rss.xml', gci_tasks_rss(),
@@ -106,31 +91,25 @@ def get_organization():
         distill_file='gci/tasks/rss.xml',
     ),
     distill_url(
-        r'gci/', gci_index,
+        r'gci/', GCIStudentsList.as_view(),
         name='community-gci',
         distill_func=get_index,
         distill_file='gci/index.html',
     ),
     distill_url(
-        r'twitter/', twitter_index,
-        name='twitter',
-        distill_func=get_index,
-        distill_file='twitter/index.html',
-    ),
-    distill_url(
-        r'log/', log_index,
-        name='log',
+        r'ci/build/', BuildLogsView.as_view(),
+        name='ci_build',
         distill_func=get_index,
-        distill_file='log/index.html',
+        distill_file='ci/build/index.html',
     ),
     distill_url(
-        r'contributors/$', contributors_index,
+        r'contributors/$', ContributorsListView.as_view(),
         name='community-data',
         distill_func=get_index,
         distill_file='contributors/index.html',
     ),
     distill_url(
-        r'meta-review/$', meta_review_index,
+        r'meta-review/$', ContributorsMetaReview.as_view(),
         name='meta_review_data',
         distill_func=get_index,
         distill_file='meta-review/index.html',
@@ -220,7 +199,7 @@ def get_organization():
         distill_file='static/unassigned-issues.json',
     ),
     distill_url(
-        r'gamification/$', gamification_index,
+        r'gamification/$', GamificationResults.as_view(),
         name='community-gamification',
         distill_func=get_index,
         distill_file='gamification/index.html',
diff --git a/community/views.py b/community/views.py
index 595c02ed..8d456db6 100644
--- a/community/views.py
+++ b/community/views.py
@@ -1,43 +1,201 @@
-from django.http import HttpResponse
-from django.views.generic.base import TemplateView
+import os
+
+import logging
+
+import requests
 
 from trav import Travis
 
+from django.views.generic.base import TemplateView
+
 from .git import (
-    get_deploy_url,
     get_org_name,
-    get_owner,
-    get_upstream_deploy_url,
+    get_remote_url
 )
+from .forms import (
+    JoinCommunityForm,
+    CommunityGoogleForm,
+    CommunityEvent,
+    OrganizationMentor,
+    GSOCStudent,
+    AssignIssue,
+    NewcomerPromotion
+)
+from data.models import Team
+from gamification.models import Participant as GamificationParticipant
+from meta_review.models import Participant as MetaReviewer
+
+GL_NEWCOMERS_GRP = 'https://gitlab.com/{}/roles/newcomers'.format(
+    get_org_name()
+)
+
+
+def initialize_org_context_details():
+    org_name = get_org_name()
+    org_details = {
+        'name': org_name,
+        'blog_url': f'https://blog.{org_name}.io/',
+        'twitter_url': f'https://twitter.com/{org_name}_io/',
+        'facebook_url': f'https://www.facebook.com/{org_name}Analyzer',
+        'repo_url': get_remote_url().href,
+        'docs': f'https://{org_name}.io/docs',
+        'newcomer_docs': f'https://{org_name}.io/newcomer',
+        'coc': f'https://{org_name}.io/coc',
+        'logo_url': (f'https://api.{org_name}.io/en/latest/_static/images/'
+                     f'{org_name}_logo.svg'),
+        'gitter_chat': f'https://gitter.im/{org_name}/{org_name}/',
+        'github_core_repo': f'https://github.com/{org_name}/{org_name}/',
+        'licence_type': 'GNU AGPL v3.0'
+    }
+    return org_details
+
+
+def get_newcomer_promotion_form_variables(context):
+    context['newcomer_promotion_form'] = NewcomerPromotion()
+    context['newcomer_promotion_form_name'] = os.environ.get(
+        'NEWCOMER_PROMOTION_REQUEST_FORM_NAME', None
+    )
+    return context
+
+
+def get_assign_issue_form_variables(context):
+    context['assign_issue_form'] = AssignIssue()
+    context['assign_issue_form_name'] = os.environ.get(
+        'ISSUES_ASSIGN_REQUEST_FORM_NAME', None
+    )
+    return context
+
+
+def get_gsoc_student_form_variables(context):
+    context['gsoc_student_form'] = GSOCStudent()
+    context['gsoc_student_form_name'] = os.environ.get(
+        'GSOC_STUDENT_FORM_NAME', None
+    )
+    return context
+
+
+def get_community_mentor_form_variables(context):
+    context['organization_mentor_form'] = OrganizationMentor()
+    context['organization_mentor_form_name'] = os.environ.get(
+        'MENTOR_FORM_NAME', None
+    )
+    return context
+
+
+def get_community_event_form_variables(context):
+    context['community_event_form'] = CommunityEvent()
+    context['community_event_form_name'] = os.environ.get(
+        'CALENDAR_NETLIFY_FORM_NAME', None
+    )
+    return context
+
+
+def get_community_google_form_variables(context):
+    context['community_google_form'] = CommunityGoogleForm()
+    context['community_google_form_name'] = os.environ.get(
+        'OSFORMS_NETLIFY_FORM_NAME', None
+    )
+    return context
+
+
+def get_all_community_forms(context):
+    context = get_community_google_form_variables(context)
+    context = get_community_event_form_variables(context)
+    context = get_community_mentor_form_variables(context)
+    context = get_gsoc_student_form_variables(context)
+    context = get_assign_issue_form_variables(context)
+    context = get_newcomer_promotion_form_variables(context)
+    return context
+
+
+def get_header_and_footer(context):
+    context['isTravis'] = Travis.TRAVIS
+    context['travisLink'] = Travis.TRAVIS_BUILD_WEB_URL
+    context['org'] = initialize_org_context_details()
+    context = get_all_community_forms(context)
+    print('Running on Travis: {}, build link: {}'.format(context['isTravis'],
+                                                         context['travisLink']
+                                                         ))
+    return context
 
 
 class HomePageView(TemplateView):
     template_name = 'index.html'
 
+    def get_team_details(self, org_name):
+        teams = [
+            f'{org_name} newcomers',
+            f'{org_name} developers',
+            f'{org_name} admins'
+        ]
+        team_details = {}
+        for team_name in teams:
+            team = Team.objects.get(name=team_name)
+            contributors_count = team.contributors.count()
+            team_details[
+                team_name.replace(org_name, '').strip().capitalize()
+            ] = contributors_count
+        return team_details
+
+    def get_quote_of_the_day(self):
+
+        try:
+            qod = requests.get('http://quotes.rest/qod?category=inspire')
+            qod.raise_for_status()
+        except requests.HTTPError as err:
+            error_info = f'HTTPError while fetching Quote of the day! {err}'
+            logging.error(error_info)
+            return
+
+        qod_data = qod.json()
+        return {
+            'quote': qod_data['contents']['quotes'][0]['quote'],
+            'author': qod_data['contents']['quotes'][0]['author'],
+        }
+
+    def get_top_meta_review_users(self, count):
+        participants = MetaReviewer.objects.all()[:count]
+        return participants
+
+    def get_top_gamification_users(self, count):
+        return enumerate(GamificationParticipant.objects.all()[:count])
+
     def get_context_data(self, **kwargs):
         context = super().get_context_data(**kwargs)
-        context['isTravis'] = Travis.TRAVIS
-        context['travisLink'] = Travis.TRAVIS_BUILD_WEB_URL
+        context = get_header_and_footer(context)
+        org_name = context['org']['name']
+        context['org']['team_details'] = dict(self.get_team_details(org_name))
+        about_org = (f'{org_name} (always spelled with a lowercase c!) is one'
+                     ' of the welcoming open-source organizations for'
+                     f' newcomers. {org_name} stands for “COde AnaLysis'
+                     ' Application” as it works well with animals and thus is'
+                     ' well visualizable which makes it easy to memorize.'
+                     f' {org_name} provides a unified interface for linting'
+                     ' and fixing the code with a single configuration file,'
+                     ' regardless of the programming languages used. You can'
+                     f' use {org_name} from within your favorite editor,'
+                     ' integrate it with your CI and, get the results as JSON'
+                     ', or customize it to your needs with its flexible'
+                     ' configuration syntax.')
+        context['org']['about'] = about_org
+        context['quote_details'] = self.get_quote_of_the_day()
+        context['top_meta_review_users'] = self.get_top_meta_review_users(
+            count=5)
+        context['top_gamification_users'] = self.get_top_gamification_users(
+            count=5)
+        return context
 
-        print('Running on Travis: {}, build link: {}'.format(
-            context['isTravis'],
-            context['travisLink']))
 
-        return context
+class JoinCommunityView(TemplateView):
 
+    template_name = 'join_community.html'
 
-def info(request):
-    data = {
-        'Org name': get_org_name(),
-        'Owner': get_owner(),
-        'Deploy URL': get_deploy_url(),
-    }
-    try:
-        upstream_deploy_url = get_upstream_deploy_url()
-        data['Upstream deploy URL'] = upstream_deploy_url
-    except RuntimeError:
-        data['Upstream deploy URL'] = 'Not found'
-
-    s = '\n'.join(name + ': ' + value
-                  for name, value in data.items())
-    return HttpResponse(s)
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        context = get_header_and_footer(context)
+        context['join_community_form'] = JoinCommunityForm()
+        context['gitlab_newcomers_group_url'] = GL_NEWCOMERS_GRP
+        context['join_community_form_name'] = os.environ.get(
+            'JOIN_COMMUNITY_FORM_NAME', None
+        )
+        return context
diff --git a/data/contrib_data.py b/data/contrib_data.py
index aacbab89..4d696b31 100644
--- a/data/contrib_data.py
+++ b/data/contrib_data.py
@@ -28,11 +28,10 @@ def get_contrib_data():
 def import_data(contributor):
     logger = logging.getLogger(__name__)
     login = contributor.get('login', None)
-    teams = contributor.get('teams')
+    teams = contributor.pop('teams')
     try:
         contributor['issues_opened'] = contributor.pop('issues')
         contributor['num_commits'] = contributor.pop('contributions')
-        contributor.pop('teams')
         c, create = Contributor.objects.get_or_create(
             **contributor
         )
diff --git a/data/management/commands/create_org_cluster_map_and_activity_graph.py b/data/management/commands/create_org_cluster_map_and_activity_graph.py
new file mode 100644
index 00000000..c71647b1
--- /dev/null
+++ b/data/management/commands/create_org_cluster_map_and_activity_graph.py
@@ -0,0 +1,20 @@
+from django.core.management.base import BaseCommand
+
+from data.org_cluster_map_handler import handle as org_cluster_map_handler
+from activity.scraper import activity_json
+
+
+class Command(BaseCommand):
+    help = 'Create a cluster map using contributors geolocation'
+
+    def add_arguments(self, parser):
+        parser.add_argument('output_dir', nargs='?', type=str)
+
+    def handle(self, *args, **options):
+        output_dir = options.get('output_dir')
+        if not output_dir:
+            org_cluster_map_handler()
+        else:
+            org_cluster_map_handler(output_dir)
+        # Fetch & Store data for activity graph to be displayed on home-page
+        activity_json('static/activity-data.js')
diff --git a/data/migrations/0005_auto_20190801_1442.py b/data/migrations/0005_auto_20190801_1442.py
new file mode 100644
index 00000000..82fba40d
--- /dev/null
+++ b/data/migrations/0005_auto_20190801_1442.py
@@ -0,0 +1,33 @@
+# Generated by Django 2.1.7 on 2019-08-01 14:42
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('data', '0004_auto_20180809_2229'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='contributor',
+            name='followers',
+            field=models.IntegerField(default=None, null=True),
+        ),
+        migrations.AddField(
+            model_name='contributor',
+            name='location',
+            field=models.TextField(default=None, null=True),
+        ),
+        migrations.AddField(
+            model_name='contributor',
+            name='public_gists',
+            field=models.IntegerField(default=None, null=True),
+        ),
+        migrations.AddField(
+            model_name='contributor',
+            name='public_repos',
+            field=models.IntegerField(default=None, null=True),
+        ),
+    ]
diff --git a/data/migrations/0006_auto_20190801_1752.py b/data/migrations/0006_auto_20190801_1752.py
new file mode 100644
index 00000000..aa2d0ef6
--- /dev/null
+++ b/data/migrations/0006_auto_20190801_1752.py
@@ -0,0 +1,18 @@
+# Generated by Django 2.1.7 on 2019-08-01 17:52
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('data', '0005_auto_20190801_1442'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='contributor',
+            name='teams',
+            field=models.ManyToManyField(related_name='contributors', to='data.Team'),
+        ),
+    ]
diff --git a/data/migrations/0007_auto_20190802_2015.py b/data/migrations/0007_auto_20190802_2015.py
new file mode 100644
index 00000000..b0cd314b
--- /dev/null
+++ b/data/migrations/0007_auto_20190802_2015.py
@@ -0,0 +1,43 @@
+# Generated by Django 2.1.7 on 2019-08-02 20:15
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('data', '0006_auto_20190801_1752'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='contributor',
+            name='is_gci_participant',
+            field=models.BooleanField(default=False),
+        ),
+        migrations.AddField(
+            model_name='contributor',
+            name='oauth_completed',
+            field=models.BooleanField(default=False),
+        ),
+        migrations.AddField(
+            model_name='contributor',
+            name='statistics',
+            field=models.TextField(default=None, null=True),
+        ),
+        migrations.AddField(
+            model_name='contributor',
+            name='type_of_issues_worked_on',
+            field=models.TextField(default=None, null=True),
+        ),
+        migrations.AddField(
+            model_name='contributor',
+            name='updated_at',
+            field=models.TextField(default=None, null=True),
+        ),
+        migrations.AddField(
+            model_name='contributor',
+            name='working_on_issues_count',
+            field=models.TextField(default=None, null=True),
+        ),
+    ]
diff --git a/data/models.py b/data/models.py
index b6ba1a0e..c794f00e 100644
--- a/data/models.py
+++ b/data/models.py
@@ -13,9 +13,19 @@ class Contributor(models.Model):
     name = models.TextField(default=None, null=True)
     bio = models.TextField(default=None, null=True)
     num_commits = models.IntegerField(default=None, null=True)
+    public_repos = models.IntegerField(default=None, null=True)
+    public_gists = models.IntegerField(default=None, null=True)
+    followers = models.IntegerField(default=None, null=True)
     reviews = models.IntegerField(default=None, null=True)
     issues_opened = models.IntegerField(default=None, null=True)
-    teams = models.ManyToManyField(Team)
+    location = models.TextField(default=None, null=True)
+    teams = models.ManyToManyField(Team, related_name='contributors')
+    statistics = models.TextField(default=None, null=True)
+    type_of_issues_worked_on = models.TextField(default=None, null=True)
+    is_gci_participant = models.BooleanField(default=False)
+    working_on_issues_count = models.TextField(default=None, null=True)
+    updated_at = models.TextField(default=None, null=True)
+    oauth_completed = models.BooleanField(default=False)
 
     def __str__(self):
         return self.login
diff --git a/data/org_cluster_map_handler.py b/data/org_cluster_map_handler.py
new file mode 100644
index 00000000..baf0969b
--- /dev/null
+++ b/data/org_cluster_map_handler.py
@@ -0,0 +1,82 @@
+import os
+import json
+
+import logging
+
+import getorg
+
+from data.models import Contributor
+
+
+def handle(output_dir='cluster_map'):
+    """
+    Creates a organization cluster map using the contributors location
+    stored in the database
+    :param output_dir: Directory where all the required CSS and JS files
+    are copied by 'getorg' package
+    """
+    logger = logging.getLogger(__name__)
+    logger.info("'cluster_map/' is the default directory for storing"
+                " organization map related files. If arg 'output_dir'"
+                ' not provided it will be used as a default directory by'
+                " 'getorg' package.")
+
+    # For creating the organization map, the 'getorg' uses a 'Nominatim' named
+    # package which geocodes the contributor location and then uses that class
+    # to create the map. Since, we're not dealing with that function which use
+    # that 'Nominatim' package because we're fetching a JSON data and storing
+    # it in our db. Therefore, defining our own simple class that can aid us
+    # to create a cluster map.
+    class Location:
+
+        def __init__(self, longitude, latitude):
+            self.longitude = longitude
+            self.latitude = latitude
+
+    org_location_dict = {}
+
+    for contrib in Contributor.objects.filter(location__isnull=False):
+        user_location = json.loads(contrib.location)
+        location = Location(user_location['longitude'],
+                            user_location['latitude'])
+        org_location_dict[contrib.login] = location
+        logger.debug(f'{contrib.login} location {user_location} added on map')
+    getorg.orgmap.output_html_cluster_map(org_location_dict,
+                                          folder_name=output_dir)
+
+    move_and_make_changes_in_files(output_dir)
+
+
+def move_and_make_changes_in_files(output_dir):
+    """
+    Move static files from 'output_dir' to django static folder which
+    is being required by the map.html which is being auto-generated
+    by getorg.
+    :param output_dir: Directory from where the files have to be moved
+    """
+
+    move_leaflet_dist_folder(output_dir)
+
+    os.rename(
+        src=get_file_path(os.getcwd(), output_dir, 'org-locations.js'),
+        dst=get_file_path(os.getcwd(), 'static', 'org-locations.js')
+    )
+
+    os.remove(get_file_path(os.getcwd(), output_dir, 'map.html'))
+
+
+def move_leaflet_dist_folder(output_dir):
+    source_path = get_file_path(os.getcwd(), output_dir, 'leaflet_dist')
+    destination_path = get_file_path(os.getcwd(), 'static', 'leaflet_dist')
+
+    # Remove existing leaflet_dir if exists
+    for root, dirs, files in os.walk(destination_path):
+        for file in files:
+            os.remove(os.path.join(destination_path, file))
+        os.rmdir(root)
+
+    os.renames(source_path, destination_path)
+
+
+def get_file_path(*args):
+    return '/'.join(args)
diff --git a/data/tests/test_contrib_data.py b/data/tests/test_contrib_data.py
index e820e413..88a20ac8 100644
--- a/data/tests/test_contrib_data.py
+++ b/data/tests/test_contrib_data.py
@@ -2,7 +2,9 @@
 
 from django.test import TestCase
 
-from data.contrib_data import get_contrib_data
+from data.contrib_data import get_contrib_data, import_data
+from gamification.tests.test_management_commands import (
+    get_false_contributors_data)
 
 
 class GetContribDataTest(TestCase):
@@ -10,3 +12,7 @@ class GetContribDataTest(TestCase):
     def test_get_contrib_data(self):
         with requests_mock.Mocker():
             get_contrib_data()
+
+    def test_false_contributor_data(self):
+        for contrib in get_false_contributors_data():
+            import_data(contrib)
diff --git a/data/tests/test_issues.py b/data/tests/test_issues.py
index f94e23e3..b75bc041 100644
--- a/data/tests/test_issues.py
+++ b/data/tests/test_issues.py
@@ -2,7 +2,9 @@
 
 from django.test import TestCase
 
-from data.issues import fetch_issues
+from data.issues import fetch_issues, import_issue
+from gamification.tests.test_management_commands import (
+    get_false_issues_data)
 
 
 class FetchIssueTest(TestCase):
@@ -10,3 +12,7 @@ class FetchIssueTest(TestCase):
     def test_fetch_issues(self):
         with requests_mock.Mocker():
             fetch_issues('GitHub')
+
+    def test_false_issue_data(self):
+        for issue in get_false_issues_data():
+            import_issue('github', issue)
diff --git a/data/tests/test_management_commands.py b/data/tests/test_management_commands.py
index f1309700..866616eb 100644
--- a/data/tests/test_management_commands.py
+++ b/data/tests/test_management_commands.py
@@ -32,8 +32,7 @@ def test_command_import_issues_data(self):
         if not issues:
             raise unittest.SkipTest(
                 'No record of issues from webservices')
-        self.assertIn('testuser',
-                      [issue.author.login for issue in issues])
+        self.assertGreater(issues.count(), 0)
 
 
 class ImportMergeRequestDataTest(TestCase):
@@ -47,5 +46,4 @@ def test_command_import_issues_data(self):
         if not mrs:
             raise unittest.SkipTest(
                 'No record of mrs from webservices')
-        self.assertIn('testuser',
-                      [mr.author.login for mr in mrs])
+        self.assertGreater(mrs.count(), 0)
diff --git a/data/tests/test_merge_requests.py b/data/tests/test_merge_requests.py
index 3d4350a8..f0efdead 100644
--- a/data/tests/test_merge_requests.py
+++ b/data/tests/test_merge_requests.py
@@ -2,7 +2,8 @@
 
 from django.test import TestCase
 
-from data.merge_requests import fetch_mrs
+from data.merge_requests import fetch_mrs, import_mr
+from gamification.tests.test_management_commands import (get_false_mrs_data)
 
 
 class FetchMergeRequestTest(TestCase):
@@ -10,3 +11,7 @@ class FetchMergeRequestTest(TestCase):
     def test_fetch_mrs(self):
         with requests_mock.Mocker():
             fetch_mrs('GitHub')
+
+    def test_false_mr_data(self):
+        for mr in get_false_mrs_data():
+            import_mr('github', mr)
diff --git a/data/tests/test_org_cluster_map_handler.py b/data/tests/test_org_cluster_map_handler.py
new file mode 100644
index 00000000..8199dcc0
--- /dev/null
+++ b/data/tests/test_org_cluster_map_handler.py
@@ -0,0 +1,22 @@
+from django.test import TestCase
+
+from data.models import Contributor
+from data.org_cluster_map_handler import handle as org_cluster_map_handler
+
+
+class CreateOrgClusterMapAndActivityGraphTest(TestCase):
+
+    @classmethod
+    def setUpTestData(cls):
+        Contributor.objects.create(login='test',
+                                   name='Test User',
+                                   location='{"latitude": 12.9,'
+                                            '"longitude": 77.8}')
+        Contributor.objects.create(login='testuser',
+                                   name='Test User 2')
+
+    def test_with_output_dir(self):
+        org_cluster_map_handler()
+
+    def test_without_output_dir(self):
+        org_cluster_map_handler(output_dir='org_map')
diff --git a/data/urls.py b/data/urls.py
index a3780aa2..6eb2a98a 100644
--- a/data/urls.py
+++ b/data/urls.py
@@ -1,7 +1,7 @@
 from django.conf.urls import url
 
-from . import views
+from .views import ContributorsListView
 
 urlpatterns = [
-    url(r'^$', views.index, name='index'),
+    url(r'^$', ContributorsListView.as_view(), name='index'),
 ]
diff --git a/data/views.py b/data/views.py
index 40436c72..53cd8a3e 100644
--- a/data/views.py
+++ b/data/views.py
@@ -1,8 +1,16 @@
+from django.views.generic import TemplateView
+
+from community.views import get_header_and_footer
 from data.models import Contributor
-from django.shortcuts import render
 
 
-def index(request):
-    contributors = Contributor.objects.all()
-    args = {'contributors': contributors}
-    return render(request, 'contributors.html', args)
+class ContributorsListView(TemplateView):
+    template_name = 'contributors.html'
+
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        context = get_header_and_footer(context)
+        contrib_objects = Contributor.objects.all()
+        context['contributors'] = contrib_objects.order_by('-num_commits',
+                                                           'name')
+        return context
diff --git a/gamification/tests/test_management_commands.py b/gamification/tests/test_management_commands.py
index 7519d3ad..ba795dc8 100644
--- a/gamification/tests/test_management_commands.py
+++ b/gamification/tests/test_management_commands.py
@@ -1,14 +1,20 @@
 from django.core.management import call_command
 from django.test import TestCase
 
+from data.issues import import_issue
+from community.git import get_org_name
+from data.merge_requests import import_mr
 from gamification.models import (
     Level,
     Badge,
     Participant,
     BadgeActivity,
 )
+from data.contrib_data import import_data
 from data.newcomers import active_newcomers
 
+ORG_NAME = get_org_name()
+
 
 class CreateConfigDataTest(TestCase):
 
@@ -79,6 +85,18 @@ class UpdateParticipantsTest(TestCase):
 
     @classmethod
     def setUpTestData(cls):
+        for contrib in get_false_contributors_data():
+            import_data(contrib)
+
+        for issue in get_false_issues_data():
+            import_issue('github', issue)
+
+        for mr in get_false_mrs_data():
+            import_mr('github', mr)
+
+        for contrib in get_false_active_newcomers():
+            Participant.objects.create(username=contrib['username'])
+
         call_command('import_issues_data')
         call_command('import_merge_requests_data')
         call_command('create_config_data')
@@ -98,3 +116,204 @@ def test_command_update_particiapants_data(self):
 
         number_of_badges = participant.badges.all().count()
         self.assertEquals(number_of_badges, 2)
+
+
+def get_false_contributors_data():
+    return [
+        {
+            'bio': '',
+            'teams': [
+                f'{ORG_NAME} newcomers'
+            ],
+            'reviews': 0,
+            'issues': 0,
+            'name': '',
+            'login': 'testuser',
+            'contributions': 1
+        },
+        {
+            'bio': '',
+            'teams': [
+                f'{ORG_NAME} newcomers'
+            ],
+            'reviews': 0,
+            'issues': 0,
+            'name': '',
+            'login': 'testuser',
+            'contributions': 1
+        },
+        {
+            'bio': '',
+            'teams': [
+            ],
+            'reviews': 0,
+            'name': '',
+            'login': 'testuser1',
+            'contributions': 1
+        }
+    ]
+
+
+def get_false_issues_data():
+    return [
+        {
+            'created_at': '2016-11-21T00:46:14',
+            'hoster': 'github',
+            'updated_at': '2017-12-21T00:00:48',
+            'labels': [
+                'status/duplicate'
+            ],
+            'number': 1,
+            'assignees': [],
+            'repo_id': 254525111,
+            'title': 'Test issue',
+            'state': 'closed',
+            'repo': f'{ORG_NAME}/{ORG_NAME}',
+            'url': f'https://github.com/{ORG_NAME}/corobo/issues/585',
+            'author': 'testuser'
+        },
+        {
+            'created_at': '2016-11-21T00:46:14',
+            'hoster': 'github',
+            'updated_at': '2017-12-21T00:00:48',
+            'labels': [
+                'difficulty/newcomer',
+                'type/bug'
+            ],
+            'number': 3,
+            'assignees': [],
+            'repo_id': 254525111,
+            'title': 'Test issue',
+            'state': 'closed',
+            'repo': f'{ORG_NAME}/{ORG_NAME}',
+            'url': f'https://github.com/{ORG_NAME}/{ORG_NAME}/issues/1',
+            'author': 'testuser1'
+        },
+        {
+            'created_at': '2016-11-21T00:46:14',
+            'hoster': 'github',
+            'updated_at': '2017-12-21T00:00:48',
+            'labels': [
+                'difficulty/newcomer',
+                'type/bug'
+            ],
+            'number': 2,
+            'assignees': [],
+            'repo_id': 254525111,
+            'title': 'Test issue',
+            'state': 'closed',
+            'repo': f'{ORG_NAME}/{ORG_NAME}',
+            'url': f'https://github.com/{ORG_NAME}/{ORG_NAME}/issues/2',
+            'author': 'testuser'
+        },
+        {
+            'created_at': '2016-11-21T00:46:14',
+            'hoster': 'github',
+            'updated_at': '2017-12-21T00:00:48',
+            'labels': [
+                'difficulty/newcomer',
+                'type/bug'
+            ],
+            'number': 2,
+            'assignees': [],
+            'title': 'Test issue',
+            'state': 'closed',
+            'repo': 'test/test',
+            'url': f'https://github.com/{ORG_NAME}/{ORG_NAME}/issues/3',
+            'author': 'testuser1'
+        }
+    ]
+
+
+def get_false_mrs_data():
+    return [
+        {
+            'created_at': '2016-02-21T05:04:25',
+            'hoster': 'github',
+            'ci_status': True,
+            'labels': [
+                'difficulty/newcomer',
+                'type/bug'
+            ],
+            'title': 'Test merge request-I',
+            'number': 1625,
+            'updated_at': '2016-04-21T12:06:19',
+            'assignees': [],
+            'repo_id': 254525111,
+            'closes_issues': [
+                2,
+                3
+            ],
+            'repo': f'{ORG_NAME}/{ORG_NAME}',
+            'url': f'https://github.com/{ORG_NAME}/{ORG_NAME}/pull/1625',
+            'state': 'merged',
+            'author': 'testuser'
+        },
+        {
+            'created_at': '2016-02-21T05:04:25',
+            'hoster': 'github',
+            'ci_status': True,
+            'labels': [
+                'status/STALE'
+            ],
+            'title': 'Test merge request-II',
+            'number': 1626,
+            'updated_at': '2016-02-21T12:06:19',
+            'assignees': [],
+            'repo_id': 25452511,
+            'closes_issues': [
+            ],
+            'repo': f'{ORG_NAME}/{ORG_NAME}',
+            'state': 'merged',
+            'url': f'https://github.com/{ORG_NAME}/{ORG_NAME}/pull/1626',
+            'author': 'testuser'
+        },
+        {
+            'created_at': '2016-02-21T05:04:25',
+            'hoster': 'github',
+            'ci_status': True,
+            'labels': [
+                'difficulty/low',
+                'type/bug'
+            ],
+            'title': 'Test merge request-III',
+            'number': 1626,
+            'updated_at': '2016-02-21T12:06:19',
+            'assignees': [
+                'testuser',
+                'testuser1'
+            ],
+            'repo_id': 25452511,
+            'closes_issues': [
+            ],
+            'repo': f'{ORG_NAME}/{ORG_NAME}',
+            'state': 'merged',
+            'url': f'https://github.com/{ORG_NAME}/{ORG_NAME}/pull/1625',
+            'author': 'testuser'
+        },
+        {
+            'created_at': '2016-02-21T05:04:25',
+            'hoster': 'github',
+            'labels': [
+                'difficulty/low',
+                'type/bug'
+            ],
+            'title': 'Test merge request-III',
+            'number': 1626,
+            'updated_at': '2016-02-21T12:06:19',
+            'assignees': [],
+            'repo_id': 25452511,
+            'repo': f'{ORG_NAME}/{ORG_NAME}',
+            'url': f'https://github.com/{ORG_NAME}/{ORG_NAME}/pull/1625',
+            'closes_issues': [
+            ],
+            'author': 'testuser1'
+        }
+    ]
+
+
+def get_false_active_newcomers():
+    return [
+        {'username': 'testuser'},
+        {'username': 'testuser1'}
+    ]
diff --git a/gamification/tests/test_views.py b/gamification/tests/test_views.py
index 64e270c7..fa7a1a22 100644
--- a/gamification/tests/test_views.py
+++ b/gamification/tests/test_views.py
@@ -25,4 +25,4 @@ def test_view_uses_correct_template(self):
     def test_all_contributors_on_template(self):
         resp = self.client.get(reverse('community-gamification'))
         self.assertEqual(resp.status_code, 200)
-        self.assertTrue(len(resp.context['participants']) == 10)
+        self.assertTrue(len(resp.context['gamification_results']) == 10)
diff --git a/gamification/views.py b/gamification/views.py
index 25b14243..d006b231 100644
--- a/gamification/views.py
+++ b/gamification/views.py
@@ -1,10 +1,14 @@
-from django.shortcuts import render
+from django.views.generic import TemplateView
 
+from community.views import get_header_and_footer
 from gamification.models import Participant
 
 
-def index(request):
-    Participant.objects.filter(username__startswith='testuser').delete()
-    participants = Participant.objects.all()
-    args = {'participants': participants}
-    return render(request, 'gamification.html', args)
+class GamificationResults(TemplateView):
+    template_name = 'gamification.html'
+
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        context = get_header_and_footer(context)
+        context['gamification_results'] = Participant.objects.all()
+        return context
diff --git a/gci/urls.py b/gci/urls.py
index a3780aa2..10e10974 100644
--- a/gci/urls.py
+++ b/gci/urls.py
@@ -3,5 +3,5 @@
 from . import views
 
 urlpatterns = [
-    url(r'^$', views.index, name='index'),
+    url(r'^$', views.GCIStudentsList.as_view(), name='index'),
 ]
diff --git a/gci/views.py b/gci/views.py
index e9c97589..ceed5c12 100644
--- a/gci/views.py
+++ b/gci/views.py
@@ -1,11 +1,13 @@
-from django.http import HttpResponse
 from datetime import datetime
 from calendar import timegm
+
 import logging
-import requests
 
+from django.views.generic import TemplateView
+
+from community.views import get_header_and_footer
+from data.models import Contributor
 from .students import get_linked_students
-from .gitorg import get_logo
 from .task import get_tasks
 
 STUDENT_URL = (
@@ -15,75 +17,78 @@
 )
 
 
-def index(request):
-    logger = logging.getLogger(__name__ + '.index')
-    try:
-        get_tasks()
-    except FileNotFoundError:
-        logger.info('GCI data not available')
-        s = ['GCI data not available']
-    else:
-        s = gci_overview()
-
-    return HttpResponse('\n'.join(s))
-
-
-def gci_overview():
-    logger = logging.getLogger(__name__ + '.gci_overview')
-    linked_students = list(get_linked_students())
-    if not linked_students:
-        logger.info('No GCI students are linked')
-        return ['No GCI students are linked']
-
-    org_id = linked_students[0]['organization_id']
-    org_name = linked_students[0]['organization_name']
-    s = []
-    s.append('<link rel="stylesheet" href="static/main.css">')
-
-    favicon = get_logo(org_name, 16)
-    with open('_site/favicon.png', 'wb') as favicon_file:
-        favicon_file.write(favicon)
-
-    org_logo = get_logo(org_name)
-    with open('_site/org_logo.png', 'wb') as org_logo_file:
-        org_logo_file.write(org_logo)
-
-    s.append('<link rel="shortcut icon" type="image/png" '
-             'href="static/favicon.png"/>')
-    s.append('<img src="static/org_logo.png" alt="'+org_name+'">')
-    s.append('<h2>Welcome</h2>')
-    s.append('Hello, world. You are at the {org_name} community GCI website.'
-             .format(org_name=org_name))
-    s.append('Students linked to %s issues:<ul class="students">' % org_name)
-    for student in linked_students:
-        student_id = student['id']
-        username = student['username']
-
-        r = requests.get('https://api.github.com/users/{}'.format(username))
-
-        if r.status_code == 404:
-            continue
-
-        student_url = STUDENT_URL.format(org_id=org_id,
-                                         student_id=student_id,
-                                         )
-        s.append('<li class="student">'
-                 'STUDENT ID: <a href="{student_url}">{student_id}</a><br />'
-                 '<div class="github-card" data-github="{username}" '
-                 'data-width="400" data-theme="default"></div>'
-                 .format(student_url=student_url, student_id=student_id,
-                         username=username))
-
-    timestamp = datetime.now().strftime('%Y-%m-%d %H:%M:%S')
-    s.append('</ul><i id="time" class="timestamp" data-time="{unix}">'
-             'Last updated: {timestamp} '
-             '(<span id="ago" class="timeago"></span>)</i>'
-             .format(unix=timegm(datetime.utcnow().utctimetuple()),
-                     timestamp=timestamp))
-
-    s.append('<script src="//cdn.jsdelivr.net/gh/lepture/github-cards@1.0.2'
-             '/jsdelivr/widget.js"></script>')
-    s.append('<script src="static/timeago.js"></script>')
-    s.append('<script>loadTimeElements()</script>')
-
-    return s
+class GCIStudentsList(TemplateView):
+    template_name = 'gci_students.html'
+
+    def get_data_updated_time(self):
+        return timegm(datetime.utcnow().utctimetuple())
+
+    def get_all_students(self):
+        """
+        Get all GCI students by filtering the tasks that are valid
+        :return: A List of all students dict having necessary information
+        about the student
+        """
+        logger = logging.getLogger(__name__ + '.gci_overview')
+        linked_students = list(get_linked_students())
+        data = {
+            'students': list(),
+            'error': None
+        }
+        if not linked_students:
+            error_message = 'No GCI students are linked'
+            logger.info(error_message)
+            data['error'] = error_message
+            return data
+        org_id = linked_students[0]['organization_id']
+        for student in linked_students:
+            student_id = student['id']
+            username = student['username']
+            contributors = Contributor.objects.filter(login=username)
+            if contributors:
+                contrib = contributors.first()
+                student['url'] = STUDENT_URL.format(org_id=org_id,
+                                                    student_id=student_id)
+                student['name'] = contrib.name
+                student['bio'] = contrib.bio
+                student['public_repos'] = contrib.public_repos
+                student['public_gists'] = contrib.public_gists
+                student['followers'] = contrib.followers
+                data['students'].append(student)
+            else:
+                logger.warning(f"GCI Student {username} doesn't exists!"
+                               f' Please check the username.')
+        return data
+
+    def get_gci_tasks_and_students(self):
+        """
+        Get all GCI students by fetching the GCI tasks and the students
+        :return: A list of all GCI Students
+        """
+        logger = logging.getLogger(__name__ + '.index')
+        gci_students = {
+            'data': {},
+            'error': None
+        }
+        try:
+            get_tasks()
+        except FileNotFoundError:
+            logger.info('GCI data not available')
+            error_message = ('No GCI data is available. Please create a'
+                             ' tasks.yaml file having GCI tasks related'
+                             ' data in it.')
+            gci_students['error'] = error_message
+        else:
+            data = self.get_all_students()
+            if data['error']:
+                gci_students['error'] = data['error']
+            else:
+                gci_students['data'] = data['students']
+        return gci_students
+
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        context = get_header_and_footer(context)
+        context['gci_students'] = self.get_gci_tasks_and_students()
+        context['updated_time'] = self.get_data_updated_time()
+        return context
diff --git a/log/view_log.py b/log/view_log.py
deleted file mode 100644
index facc4190..00000000
--- a/log/view_log.py
+++ /dev/null
@@ -1,12 +0,0 @@
-from django.http import HttpResponse
-
-
-def index(request):
-    logs = get_logs()
-    return HttpResponse('<br>'.join(logs))
-
-
-def get_logs():
-    with open('./_site/community.log') as log_file:
-        for line in log_file:
-            yield line.rstrip()
diff --git a/meta_review/urls.py b/meta_review/urls.py
index a3780aa2..6189e683 100644
--- a/meta_review/urls.py
+++ b/meta_review/urls.py
@@ -1,7 +1,7 @@
 from django.conf.urls import url
 
-from . import views
+from .views import ContributorsMetaReview
 
 urlpatterns = [
-    url(r'^$', views.index, name='index'),
+    url(r'^$', ContributorsMetaReview.as_view(), name='index'),
 ]
diff --git a/meta_review/views.py b/meta_review/views.py
index 45e68cfd..7e30a539 100644
--- a/meta_review/views.py
+++ b/meta_review/views.py
@@ -1,15 +1,22 @@
 from meta_review.models import Participant
-from django.shortcuts import render
 from django.db.models import Q
+from django.views.generic import TemplateView
 
+from community.views import get_header_and_footer
 
-def index(request):
-    participants = Participant.objects.all().exclude(
-        Q(pos_in=0),
-        Q(neg_in=0),
-        Q(pos_out=0),
-        Q(neg_out=0),
-        Q(offset=0)
-    )
-    args = {'participants': participants}
-    return render(request, 'meta_review.html', args)
+
+class ContributorsMetaReview(TemplateView):
+    template_name = 'meta_review.html'
+
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        context = get_header_and_footer(context)
+        participants = Participant.objects.all().exclude(
+            Q(pos_in=0),
+            Q(neg_in=0),
+            Q(pos_out=0),
+            Q(neg_out=0),
+            Q(offset=0)
+        )
+        context['contributors_meta_review_details'] = participants
+        return context
diff --git a/requirements.txt b/requirements.txt
index d2f46479..5c915a34 100644
--- a/requirements.txt
+++ b/requirements.txt
@@ -1,3 +1,4 @@
+getorg~=0.3.1
 git+https://gitlab.com/coala/coala-utils.git
 git-url-parse
 django>2.1,<2.2
diff --git a/setup.cfg b/setup.cfg
index 4087933a..60da3717 100644
--- a/setup.cfg
+++ b/setup.cfg
@@ -14,10 +14,9 @@ testpaths =
   gci
   gsoc
   gamification
-  log
+  ci_build
   meta_review
   model
-  twitter
   unassigned_issues
 
 python_files = test_*.py
@@ -70,10 +69,9 @@ source =
   gci
   gsoc
   gamification
-  log
+  ci_build
   meta_review
   model
-  twitter
   unassigned_issues
 
 omit =
@@ -82,11 +80,10 @@ omit =
   community/git.py
   gci/*.py
   gsoc/*.py
-  log/*.py
+  ci_build/*.py
   meta_review/handler.py
   model/*.py
   openhub/*.py
-  twitter/*.py
   inactive_issues/inactive_issues_scraper.py
   unassigned_issues/unassigned_issues_scraper.py
   */migrations/*.py
diff --git a/static/charts.js b/static/charts.js
deleted file mode 100644
index 6169129e..00000000
--- a/static/charts.js
+++ /dev/null
@@ -1,86 +0,0 @@
-/* globals $, Chart */
-var curChart;
-
-function setChart(labels, openedData, closedData, type) {
-  var ctx = document.getElementById("canvas");
-
-  curChart = new Chart(ctx, {
-    type: 'line',
-    data: {
-      labels: labels,
-      datasets: [{
-        label: "Issues Opened",
-        backgroundColor: "RGBA(33, 150, 243, 0.2)",
-        borderColor: "RGBA(33, 150, 243, 1)",
-        data: openedData,
-        fill: true,
-      }, {
-        label: "Issues Closed",
-        backgroundColor: "RGBA(244, 67, 54, 0.2)",
-        borderColor: "RGBA(244, 67, 54, 1)",
-        data: closedData,
-        fill: true,
-      }]
-    },
-    options: {
-      responsive: true,
-      title: {
-        display: true,
-        text: 'Community Activity'
-      },
-      tooltips: {
-        mode: 'index',
-        intersect: false,
-      },
-      hover: {
-        mode: 'nearest',
-        intersect: true
-      },
-      scales: {
-        xAxes: [{
-          display: true,
-          scaleLabel: {
-            display: true,
-            labelString: type
-          }
-        }],
-        yAxes: [{
-          display: true,
-          scaleLabel: {
-            display: true,
-            labelString: 'Number'
-          }
-        }]
-      }
-    }
-  });
-}
-
-function updateChart(type) {
-  if(curChart){ curChart.destroy(); }
-
-  $.getJSON("/static/activity-data.json",
-    function(data) {
-      var labels, openedData, closedData;
-      if(type === "Month") {
-        labels = data.year.labels;
-        openedData = data.year.opened;
-        closedData = data.year.closed;
-      }
-      else if(type === "Week") {
-        labels = data.month.labels;
-        openedData = data.month.opened;
-        closedData = data.month.closed;
-      }
-      else {
-        labels = data.week.labels;
-        openedData = data.week.opened;
-        closedData = data.week.closed;
-      }
-      setChart(labels, openedData, closedData, type);
-  })
-  .fail(function(data, textStatus, error) {
-    var err = textStatus + ", " + error;
-    console.error("Request Failed: " + err);
-  });
-}
diff --git a/static/css/build_logs.css b/static/css/build_logs.css
new file mode 100644
index 00000000..44922333
--- /dev/null
+++ b/static/css/build_logs.css
@@ -0,0 +1,84 @@
+.build-info-section section,
+.build-logs-section section {
+    min-width: 300px;
+    width: 80%;
+}
+
+.build-information,
+.build-logs {
+    background-color: black;
+    padding-left: 10px;
+    font-weight: bold;
+    color: white;
+}
+
+.build-information p {
+    font-size: 1.5em;
+    margin: 0;
+}
+
+.build-logs {
+    max-height: 900px;
+    overflow: scroll;
+    overflow-x: hidden;
+    overflow-y: auto;
+}
+
+.build-logs p {
+    margin: 0;
+}
+
+.build-logs-section .log-chooser {
+    width: 25%;
+    min-width: 150px;
+    border-radius: 100px;
+    box-shadow: 0 0 25px 2px black;
+    color: #454343;
+    background-color: #c7da99;
+    padding-left: 10px;
+    margin: auto 0 auto auto;
+}
+
+.build-logs-section .log-chooser input,
+.build-logs-section .log-chooser input:focus:not(.browser-default) {
+    border-bottom: none;
+    margin-bottom: 0;
+}
+
+.build-logs-section .small-screen,
+.build-logs-section .fa-close {
+    display: none;
+}
+
+.form-fields {
+    margin: auto 0 auto auto;
+    width: 60%;
+    padding-top: 10px;
+}
+
+.search-field {
+    width: 60%;
+    min-width: 180px;
+}
+
+.section-header {
+    display: flex;
+    align-items: center;
+}
+
+.section-header form {
+    display: flex;
+}
+
+@media only screen and (max-width: 660px) {
+    .build-logs-section .search-field {
+        display: none;
+    }
+    .build-logs-section .small-screen {
+        display: flex;
+        align-items: center;
+        margin: auto;
+        margin-right: 3px;
+        font-size: 2em;
+    }
+}
diff --git a/static/css/contributors.css b/static/css/contributors.css
new file mode 100644
index 00000000..e2722c39
--- /dev/null
+++ b/static/css/contributors.css
@@ -0,0 +1,119 @@
+.commits,
+.reviews,
+.issues-opened {
+    padding: 0 5px;
+}
+
+.contributions {
+    margin: 10px;
+}
+
+.contributions p {
+    margin: 0;
+}
+
+.contributors-cards {
+    display: flex;
+    justify-content: space-evenly;
+    flex-flow: row wrap;
+    margin: 50px;
+}
+
+.contributor-card {
+    background-color: #efefef;
+    box-shadow: 0 0 25px 2px black;
+    border-radius: 30px;
+    margin: 0 15px 20px 15px;
+    width: 220px;
+    border: 5px #c0c5d1 solid;
+}
+
+.contributors-section .fa-close {
+    display: none;
+}
+
+.contributor-details {
+    text-align: center;
+}
+
+.contributor-image img {
+    border-radius: 30px 30px 0 0;
+    width: 210px;
+}
+
+.form-fields {
+    margin-top: 3%;
+    width: 40%;
+    min-width: 300px;
+}
+
+.repository-canvas {
+    position: relative;
+    margin: auto;
+    width: 60vw;
+    height: 70vh;
+}
+
+.search-results {
+    width: 100%;
+    background-color: transparent;
+    border-radius: 30px;
+    overflow: auto;
+    padding: 0 20px;
+    max-height: 150px;
+    display: none;
+}
+
+.side-border {
+    border-width: 0 0 0 1px;
+    border-color: darkgray;
+    border-style: solid;
+}
+
+.some-important-information, .issues-labels,
+.github-issue-labels, .issues-count, .user-updated-datetime,
+.gitlab-issue-labels{
+    padding: 0 10px;
+}
+
+.stats-canvas {
+    position: relative;
+    margin: auto;
+    width: 35vw;
+    height: 50vh;
+}
+
+.user-statistics {
+    display: none;
+    position: fixed;
+    top: 15%;
+    left: 10%;
+    width: 80%;
+    height: 70vh;
+    background-color: white;
+    z-index: 1002;
+    overflow: auto;
+    border-radius: 10px;
+    box-shadow: 0 0 25px 2px black;
+}
+
+.user-statistics-option {
+    position: absolute;
+    float: right;
+    margin-left: 180px;
+    margin-top: 10px;
+    background: black;
+    color: white;
+    font-size: 1.5rem;
+    border-radius: 50px;
+    width: 20px;
+    text-align: center;
+    cursor: pointer;
+}
+
+@media only screen and (max-width: 600px) {
+    .stats-canvas {
+        width: 50vw;
+        height: 50vh;
+    }
+}
diff --git a/static/css/gamification.css b/static/css/gamification.css
new file mode 100644
index 00000000..30c8edcd
--- /dev/null
+++ b/static/css/gamification.css
@@ -0,0 +1,104 @@
+.bottom-center {
+    position: absolute;
+    width: 100px;
+    bottom: 2%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+}
+
+.gamifier-details {
+    max-width: 79%;
+    display: flex;
+}
+
+.gamifier-details-part-1,
+.gamifier-details-part-2,
+.gamifier-details-part-3 {
+    max-width: 44%;
+    max-height: 80%;
+    padding: 10px 5px;
+}
+
+.gamifier-card {
+    width: 100%;
+    min-height: 380px;
+}
+
+.gamifier-image {
+    width: 20%;
+}
+
+.gamifier-image img{
+    width: 90%;
+    margin-right: 0;
+    margin-left: 1%;
+    min-width: 100px;
+
+}
+
+.github-icon {
+    color: white;
+    background-color: black;
+    border-radius: 100px;
+}
+
+.gitlab-icon {
+    color: #e33834;
+    border-radius: 100px;
+}
+
+.filter-btn {
+    width: 107px;
+    margin-top: 3%;
+    margin-left: 3%;
+}
+
+.filter-btn .btn {
+    text-transform: none;
+    border-radius: 100px;
+    box-shadow: 0 0 25px 2px black;
+}
+
+.social-icons {
+    font-size: 1.5em;
+}
+
+@media only screen and (max-width: 890px){
+
+    .gamifier-card {
+        max-width: 100%;
+        width: auto;
+        margin: 10px;
+    }
+
+    .gamifier-details {
+        max-width: 100%;
+        padding: 0 10px;
+    }
+
+    .gamifier-image {
+        margin: auto;
+        width: 35%;
+    }
+
+    .bottom-center {
+        bottom: 2%;
+    }
+
+    @media only screen and (max-width: 526px){
+
+        .gamifier-details-part-3 {
+            display: none;
+        }
+
+        .gamifier-details-part-1,
+        .gamifier-details-part-2 {
+            max-width: 50%;
+        }
+
+        .gamifier-image {
+            width: 50%;
+        }
+
+    }
+}
diff --git a/static/css/gci_students.css b/static/css/gci_students.css
new file mode 100644
index 00000000..a1a2c3e0
--- /dev/null
+++ b/static/css/gci_students.css
@@ -0,0 +1,52 @@
+.data-fetch-error {
+    padding: 20px 20px 0 20px;
+}
+
+.gci-students {
+    padding: 2% 2%;
+}
+
+.gci-students .student-card {
+    box-shadow: 0 0 25px 2px black;
+    background-color: #c7da99;
+    font-size: large;
+    border: 4px #6c9a55 solid;
+}
+
+
+.gci-students .student-image {
+    align-items: normal;
+}
+
+.gci-students .student-details {
+    width: 100%;
+}
+
+@media only screen and (min-width: 768px) {
+    .gci-students .student-card {
+       width: 45%;
+       height: 300px;
+       overflow-y: auto;
+    }
+}
+
+.participated-year,
+.gci-student-id,
+.public-repos,
+.public-gists,
+.followers {
+    color: #37474f;
+    font-weight: bold;
+    padding-right: 3px;
+}
+
+.web-page-details {
+    width: 100%;
+}
+
+.web-page-description,
+.data-updated-time,
+.data-fetch-error {
+    text-align: center;
+    font-size: large;
+}
diff --git a/static/css/index.css b/static/css/index.css
new file mode 100644
index 00000000..d50f0193
--- /dev/null
+++ b/static/css/index.css
@@ -0,0 +1,114 @@
+.activity-graph {
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+    align-items: center;
+    padding-top: 3%;
+}
+
+.activity-graph-canvas {
+       width: 75%;
+}
+
+.activity-graph .input-field {
+    width: 100px;
+    margin-top: 0;
+}
+
+.community-header-image img {
+    width: 100%;
+    box-shadow: 0 -5px 15px black;
+}
+
+.join-btn a.btn-large {
+    min-width: 300px;
+    width: 30%;
+    margin-top: 3%;
+    box-shadow: 0 0 25px 2px black;
+    border-radius: 100px;
+    background-color: #edf5af;
+    color: #636060;
+    text-transform: full-width;
+    font-size: 1em;
+    letter-spacing: 0;
+    padding: 0 3%;
+}
+
+.leaderboards-btn {
+    float: right;
+    width: 100%;
+    border-bottom-right-radius: 1000px;
+    border-bottom-left-radius: 1000px;
+}
+
+.org-teams-stats {
+    width: 70%;
+    margin: auto;
+}
+
+.organization_map {
+    text-align: center;
+    padding: 2% 0;
+}
+
+.top-meta-reviewers {
+    background-color: #fef200;
+}
+
+.top-gamifiers {
+    background-color: #ee8940;
+}
+
+.top-contributors {
+    -webkit-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    display: flex;
+    justify-content: center;
+    flex-flow: row wrap;
+    padding-top: 2%;
+}
+
+.top-meta-reviewers,
+.top-gamifiers {
+    margin: 0 3%;
+    border-radius: 10%;
+    box-shadow: 0 0 25px 2px;
+    font-size: medium;
+}
+
+.quote-of-day div.quote{
+    width: auto;
+    max-width: 70%;
+}
+
+@media only screen and (min-width: 858px) {
+    .community-header-image img{
+        height: 450px;
+
+    }
+}
+
+@media only screen and (max-width: 600px) {
+    .activity-graph {
+       display: none;
+    }
+    .join-btn a.btn-large {
+        margin-bottom: 20px;
+    }
+}
+
+@media only screen and (min-width: 900px){
+    .top-meta-reviewers,
+    .top-gamifiers {
+        width: 35%;
+    }
+}
+
+@media only screen and (max-width: 644px){
+    .top-meta-reviewers,
+    .top-gamifiers {
+        margin: 3% 3%;
+        width: 70%
+    }
+}
diff --git a/static/css/join-community.css b/static/css/join-community.css
new file mode 100644
index 00000000..85c9a153
--- /dev/null
+++ b/static/css/join-community.css
@@ -0,0 +1,25 @@
+.join-community-form .row {
+    margin: 5px auto;
+}
+
+.join-community-form .row .input-field,
+.join-community-form p {
+    margin: 0 auto;
+}
+
+.join-community-form label{
+    font-size: 1.3em;
+    color: black;
+}
+
+.join-community-form ::placeholder{
+    color: gray;
+}
+
+.validation-checkboxes {
+    padding: 0 15px;
+}
+
+.submit-btn{
+    margin: 15px;
+}
diff --git a/static/css/main.css b/static/css/main.css
new file mode 100644
index 00000000..5c00f1d0
--- /dev/null
+++ b/static/css/main.css
@@ -0,0 +1,311 @@
+.apply-flex {
+    display: flex;
+    flex-flow: row wrap;
+    align-items: center;
+}
+
+body {
+    font-family: 'Ubuntu Mono', monospace;
+    background-color: #edf5af;
+}
+
+.bold-text,
+.sidenav.bold-text {
+    font-weight: bold;
+}
+
+.bold-text i.social-icons,
+.sidenav i.social-icons {
+    font-size: 1.5em;
+}
+
+.clickable-row {
+    cursor: pointer;
+}
+
+.close-form {
+    justify-content: end;
+    padding: 10px 10px 0 0;
+    font-size: 1.5em;
+    cursor: pointer;
+}
+
+.custom-green-color-font {
+    color: #2d5d13
+}
+
+.center-content {
+    justify-content: center;
+}
+
+.community-form {
+    position: fixed;
+    width: 70%;
+    min-width: 330px;
+    top: 15%;
+    left: 15%;
+    border-radius: 20px;
+    box-shadow: 0 -5px 15px black;
+    background-color: #edf5af;
+    padding: 20px;
+    height: 80%;
+    overflow-x: auto;
+}
+
+.community-form form {
+    padding-bottom: inherit;
+
+}
+.community-form form label {
+    font-weight: bold;
+    font-size: 1.5rem;
+    color: darkcyan;
+}
+
+.community-form form p{
+    margin: 0;
+}
+
+.community-form form textarea{
+    margin-top: 10px;
+}
+
+.community-form form .row{
+    margin-bottom: 0;
+}
+
+.community-form ::placeholder {
+    color: black;
+}
+
+.evenly-spread-content {
+    justify-content: space-evenly;
+}
+
+.gray-font-color {
+    color: #37474f;
+}
+
+.error-message {
+    background-color: #d57c7b;
+    color: white;
+    margin: 0 10px;
+    padding: 5px 10px;
+}
+
+.display-none {
+    display: none;
+}
+
+.form-popup,
+.form-submission-popup {
+    width: 100%;
+    height: 100%;
+    justify-content: center;
+    display: none;
+    opacity:.95;
+    z-index: 1002;
+    position:fixed;
+}
+
+.form-step-div {
+    box-shadow: 0 -5px 15px black;
+    margin: 30px 0 20px 0;
+    border-radius: 30px;
+    padding: 5px 10px 0 10px;
+}
+
+footer .footer-icons {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-evenly;
+    line-height: 3em;
+}
+
+footer.footer-icons.icon {
+    color: white;
+}
+
+footer .social-buttons {
+    background-color: black;
+    text-transform: none;
+}
+
+.inline-contents {
+    display: inline-flex;
+}
+
+.large-font {
+    font-size: larger;
+}
+
+.login-form,
+.form-submission-message {
+    width: 30%;
+    min-width: 340px;
+    background-color: white;
+    box-shadow: 0 -5px 15px black;
+    margin: 5em auto;
+}
+
+.main-content {
+    background-color: #edf5af;
+    padding-bottom: 3%;
+}
+
+.main-content h3 {
+    color: #37474f;
+}
+
+.message {
+    padding: 10px;
+    text-align: justify;
+}
+
+nav {
+    background-color: #37474f;
+}
+
+nav .brand-logo img {
+    width: 60px;
+}
+
+.netlify-image {
+    min-width:133px;
+    width: 50%;
+}
+
+.nav-menu-font-size,
+.sidenav .nav-menu-font-size {
+    font-size: 20px;
+}
+
+.oauth-error {
+    display: none;
+}
+
+.oauth-providers {
+    justify-content: center;
+    flex-direction: column;
+}
+
+.oauth-providers a{
+    margin: 0.5em;
+    font-weight: bold;
+    width: 80%;
+}
+
+.organizations {
+    justify-content: center;
+}
+
+.org-logo {
+    min-width: 133px;
+    width: 35%;
+}
+
+.organizations img {
+    padding: 10px;
+}
+
+p {
+    font-size: medium;
+}
+
+.page-name {
+    align-items: center;
+    display: flex;
+    text-align: center;
+}
+
+.page-footer {
+    background-color: #37474f;
+    box-shadow: 0 -5px 15px black;
+}
+
+.page-footer .footer-copyright {
+    background-color: #263238;
+}
+
+.search-field {
+    border-radius: 100px;
+    box-shadow: 0 0 25px 2px black;
+    color: #454343;
+    background-color: #edf5af;
+    padding: 0 20px;
+    flex-flow: row;
+    margin: auto auto auto 0;
+}
+
+#search {
+    border-bottom: none;
+    padding-left: 15px;
+    margin-bottom: 0;
+    font-weight: bold;
+}
+
+#search::placeholder {
+    color: grey;
+}
+
+#search:focus:not(.browser-default) {
+    background-color: #edf5af;
+    border-radius: 100px;
+    font-size: medium;
+    padding-left: 15px;
+    margin-bottom: 0;
+}
+
+.sidenav .dropdown-trigger-sidenav i {
+    float: none;
+}
+
+strong {
+    font-weight: bold;
+}
+
+.student {
+    padding-bottom: 20px;
+}
+
+.students {
+    list-style: none;
+}
+
+.text-center {
+    text-align: center;
+}
+
+#user-dropdown li.user-logout {
+    display: none;
+}
+
+.web-page-details {
+    width: 100%;
+}
+
+.web-page-description,
+.data-updated-time,
+.data-fetch-error {
+    text-align: center;
+    font-size: large;
+    color: #2d5d13;
+}
+
+@media only screen and (max-width: 600px) {
+    nav .brand-logo img {
+        width: 55px;
+    }
+}
+
+@media only screen and (max-width: 530px){
+    .page-name {
+        margin: 0;
+    }
+}
+
+@media only screen and (max-width: 400px) {
+    .community-form {
+        left: 10px;
+    }
+}
diff --git a/static/css/meta-reviewers.css b/static/css/meta-reviewers.css
new file mode 100644
index 00000000..f1b810b3
--- /dev/null
+++ b/static/css/meta-reviewers.css
@@ -0,0 +1,96 @@
+.contributor-details-part-1 {
+    padding-right: 5px;
+}
+
+.contributor-details-part-2 {
+    padding-left: 5px;
+    border-left: 1px #37474f solid;
+}
+
+.column-flex {
+    display: flex;
+    flex-direction: column;
+}
+
+.received-reactions div {
+    padding-left: 14px;
+}
+
+.meta-reviewer {
+    background-color: #c7da99;
+    width: 580px;
+    border: 4px #6c9a55 solid;
+}
+
+.metareviewer-details {
+    display: flex;
+    width: 66%;
+}
+
+.meta-reviewer-image {
+    position: relative;
+    text-align: center;
+    color: white;
+}
+
+.meta-reviewer-image img{
+    border-radius: 30px;
+    margin: 20px;
+    width: 150px;
+}
+
+.top-right {
+    position: absolute;
+    top: 30px;
+    right: 25px;
+    width: 30px;
+    border-radius: 100%;
+    background-color: #37474f;
+}
+
+@media only screen and (max-width: 706px){
+    .contributors-cards {
+        margin: 50px 0;
+    }
+    .contributor-card {
+        margin: 0 10px 20px;
+        min-height: 230px;
+    }
+
+    .metareviewer-details {
+        width: 60%;
+    }
+
+    .meta-reviewer-image {
+        width: 40%;
+    }
+
+    .meta-reviewer-image img {
+        max-width: 80%;
+        margin: 20px 10px;
+    }
+
+    @media only screen and (max-width:419px){
+
+        .metareviewer-details {
+            width: 100%;
+        }
+
+        .meta-reviewer {
+            margin: 0 10px 20px 10px;
+        }
+
+        .meta-reviewer-image {
+            width: 100%;
+        }
+
+        .contributor-details-part-1 {
+            padding: 0 0 10px 10px;
+        }
+
+        .top-right {
+            right: 105px;
+        }
+
+    }
+}
diff --git a/static/images/favicon.ico b/static/images/favicon.ico
new file mode 100644
index 00000000..8290d1ba
Binary files /dev/null and b/static/images/favicon.ico differ
diff --git a/static/images/os_community_header.jpg b/static/images/os_community_header.jpg
new file mode 100644
index 00000000..82d28ecb
Binary files /dev/null and b/static/images/os_community_header.jpg differ
diff --git a/static/images/os_community_logo.png b/static/images/os_community_logo.png
new file mode 100644
index 00000000..3b2b2da0
Binary files /dev/null and b/static/images/os_community_logo.png differ
diff --git a/static/js/build_logs.js b/static/js/build_logs.js
new file mode 100644
index 00000000..534db251
--- /dev/null
+++ b/static/js/build_logs.js
@@ -0,0 +1,102 @@
+$(document).ready(function(){
+    $('select').formSelect();
+
+    var log_chooser_input = $('#log-chooser-input');
+    var search_input = $('#search');
+    var search_icon = $('.build-logs-section .small-screen');
+    var close_icon = $('.build-logs-section .fa-close');
+    var log_chooser_div = $('.build-logs-section .log-chooser');
+    var search_field_div = $('.build-logs-section .search-field');
+    var log_type = null;
+    var logs_data = null;
+    var searched_keyword = '';
+
+    function addLogsHTML(info){
+        var info_el = $('<p></p>').text(info);
+        $('.build-logs').append(info_el);
+    }
+
+    function updateBuildLogsHTML(){
+        $('.build-logs p').remove();
+        if(logs_data.length > 0) {
+            for(var entry in logs_data){
+                if(logs_data[entry]){
+                    addLogsHTML(logs_data[entry]);
+                }
+            }
+        }
+        else {
+            var info = 'There are no log entries for tag ' + log_type + '.';
+            addLogsHTML(info);
+        }
+    }
+
+    function updateBuildLogs(type){
+        $.getJSON("/static/ci-build-detailed-logs.json", function(data) {
+            log_type = type;
+            if(log_type === 'logs') {
+                logs_data = data[log_type];
+            }
+            else {
+                logs_data = data.logs_level_Specific[log_type];
+            }
+            updateBuildLogsHTML();
+        })
+        .fail(function(data, textStatus, error) {
+            var err = "Request Failed: " + textStatus + ", " + error;
+            console.error(err);
+        });
+    }
+
+    function searchBuildLogs(){
+        var found = false;
+        var info = '';
+        for(var entry in logs_data){
+            if(logs_data[entry]){
+                info = logs_data[entry];
+                if(info.includes(searched_keyword)){
+                    found = true;
+                    addLogsHTML(info);
+                }
+            }
+        }
+        if(!found){
+            if(log_type === 'logs'){
+                info = searched_keyword + ' not found in logs!';
+            }
+            else {
+                info = searched_keyword + ' not found in ' + log_type +
+                ' level logs!';
+            }
+            addLogsHTML(info);
+        }
+    }
+
+    updateBuildLogs('logs');
+
+    log_chooser_input.on('change', function(){
+        updateBuildLogs(log_chooser_input.val());
+    });
+
+    search_input.on('keypress', function(key){
+        if(key.which === 13){
+            searched_keyword = search_input.val();
+            $('.build-logs p').remove();
+            searchBuildLogs();
+        }
+    });
+
+    search_icon.on('click', function(){
+        search_icon.css('display', 'none');
+        close_icon.css('display', 'block');
+        log_chooser_div.css('display', 'none');
+        search_field_div.css('display', 'flex');
+    });
+    close_icon.on('click', function(){
+        search_icon.css('display', 'flex');
+        close_icon.css('display', 'none');
+        log_chooser_div.css('display', 'flex');
+        search_field_div.css('display', 'none');
+    });
+
+});
diff --git a/static/js/contributor_statistics.js b/static/js/contributor_statistics.js
new file mode 100644
index 00000000..c2a573d7
--- /dev/null
+++ b/static/js/contributor_statistics.js
@@ -0,0 +1,728 @@
+/* globals Chart, Map, Set */
+$(document).ready(function () {
+  var hoster_selector = $('#hoster-selector');
+  var stats_divider = $('#stats-divider');
+  var user_statistics_display = $('.user-statistics');
+  var commitsChart, reviewsChart, issuesChart, mergeRequestsChart;
+  var commits_canvas = $('#commits-canvas');
+  var issues_canvas = $('#issues-canvas');
+  var merge_requests_canvas = $('#merge-requests-canvas');
+  var reviews_canvas = $('#reviews-canvas');
+  var repository_stats_canvas = $('#repository-stats-canvas');
+  var month_names = ["January", "February", "March", "April", "May", "June",
+    "July", "August", "September", "October", "November", "December"
+  ];
+
+  function displayDataUpdatedDates(data) {
+    var user_data_updated_dates = data.updated_at;
+    var user_updated_el = $('.user-updated-datetime');
+    user_updated_el.empty();
+    var gh_date = new Date(user_data_updated_dates.github);
+    var gl_date = new Date(user_data_updated_dates.gitlab);
+    var last_fetched_gh_data_el = $('<p><strong></strong></p>').text(
+      'GitHub: ' + gh_date.toUTCString());
+    var last_fetched_gl_data_el = $('<p><strong></strong></p>').text(
+      'GitLab: ' + gl_date.toUTCString());
+    user_updated_el.append(last_fetched_gh_data_el);
+    user_updated_el.append(last_fetched_gl_data_el);
+    user_updated_el.css('justify-content', 'space-evenly');
+  }
+
+  function displayWorkingOnIssuesCount(data) {
+    var on_hoster_counts = data.working_on_issues_count;
+    var count_list_el = $('.count-list');
+    count_list_el.empty();
+    var github_issue_count_el = $('<li></li>').text('GitHub: ' +
+                                                    on_hoster_counts.github);
+    var gitlab_issue_count_el = $('<li></li>').text('GitLab: ' +
+                                                    on_hoster_counts.gitlab);
+    count_list_el.append(github_issue_count_el);
+    count_list_el.append(gitlab_issue_count_el);
+  }
+
+  function setLabelCSSProperties(label_element, bg_color){
+      label_element.css('background-color', bg_color);
+      label_element.css('color', 'white');
+      label_element.css('border-radius', '10px');
+      label_element.css('margin', '0 3px');
+      label_element.css('padding', '5px');
+      return label_element;
+  }
+
+  function displayWorkedOnIssueLabels(data) {
+    var issue_labels = data.type_of_issues_worked_on;
+    var gh_issue_labels_el = $('.github-issue-labels');
+    var gl_issue_labels_el = $('.gitlab-issue-labels');
+    gh_issue_labels_el.empty();
+    gl_issue_labels_el.empty();
+    jQuery.each(issue_labels.github, function (label_name, color) {
+      var label_el = $('<p></p>').text(label_name);
+      label_el = setLabelCSSProperties(label_el, '#'+color);
+      gh_issue_labels_el.append(label_el);
+    });
+    jQuery.each(issue_labels.gitlab, function (label_name, color) {
+      var label_el = $('<p></p>').text(label_name);
+      label_el = setLabelCSSProperties(label_el, color);
+      gl_issue_labels_el.append(label_el);
+    });
+  }
+
+  function get_options(title) {
+    return {
+      responsive: true,
+      maintainAspectRatio: false,
+      fill: true,
+      borderWidth: 3,
+      title: {
+        display: true,
+        text: title
+      },
+      tooltips: {
+        mode: 'index',
+        intersect: false,
+      },
+      hover: {
+        mode: 'nearest',
+        intersect: true
+      },
+      scales: {
+        xAxes: [{
+          stacked: true,
+          display: true,
+          scaleLabel: {
+            display: true,
+          }
+        }],
+        yAxes: [{
+          stacked: true,
+          display: true,
+          scaleLabel: {
+            display: true,
+            labelString: 'Number'
+          }
+        }]
+      }
+    };
+  }
+
+  function get_dataset_properties(label, backgroundColor, data){
+    return {
+      label: label,
+      backgroundColor: backgroundColor,
+      data: data,
+    };
+  }
+
+  function setRepositoryCanvasChart(stats) {
+    new Chart(repository_stats_canvas, {
+      type: 'bar',
+      data: {
+        labels: stats.repositories,
+        datasets: [
+          get_dataset_properties("Commits", "RGBA(236,255,52,0.7)",
+                                 stats.commits),
+          get_dataset_properties("Reviews", "RGBA(236,151,52,0.7)",
+                                 stats.reviews),
+          get_dataset_properties("Issues Opened", "RGBA(178, 191, 0, 0.7)",
+                                 stats.issues_opened),
+          get_dataset_properties("Issues Assigned", "RGBA(178, 52, 237, 0.7)",
+                                 stats.assigned_issues),
+          get_dataset_properties("Issues Closed", "RGBA(255, 52, 61, 0.7)",
+                                 stats.issues_closed),
+          get_dataset_properties("Merge Requests Opened", "RGBA(255, 190," +
+            " 217, 0.7)", stats.merge_requests_opened),
+          get_dataset_properties("Unmerged Merge Requests", "RGBA(87, 190," +
+            " 138, 0.7)", stats.unmerged_merge_requests),
+          ]
+      },
+      options: get_options('Repository-Wise Statistics')
+    });
+  }
+
+  function setCommitsAndReviewsChart(commitLabels, commitData,
+                                     reviewLabels, reviewData) {
+
+    commitsChart = new Chart(commits_canvas, {
+      type: 'bar',
+      data: {
+        labels: commitLabels,
+        datasets: [
+          get_dataset_properties("Commits Activity", "RGBA(87, 190, 217," +
+            " 0.7)", commitData)
+        ]
+      },
+      options: get_options('Commits Activity')
+    });
+
+    reviewsChart = new Chart(reviews_canvas, {
+      type: 'bar',
+      data: {
+        labels: reviewLabels,
+        datasets: [
+          get_dataset_properties("Reviews Activity", "RGBA(87, 190, 138," +
+            " 0.7)", reviewData)
+        ]
+      },
+      options: get_options('Review Activity'),
+    });
+  }
+
+  function setIssuesCanvasChart(data){
+    var data_labels = new Set();
+    jQuery.each(data, function (subtype, display_filters){
+      jQuery.each(display_filters, function (filter, value) {
+        data_labels.add(filter);
+      });
+    });
+    data_labels.forEach(function (data_label) {
+      jQuery.each(data, function (subtype){
+        if(isNaN(data[subtype][data_label])){
+          data[subtype][data_label] = 0;
+        }
+      });
+    });
+    data_labels = Array.from(data_labels);
+    issuesChart = new Chart(issues_canvas, {
+      type: 'bar',
+      data: {
+        labels: data_labels,
+        datasets: [
+          get_dataset_properties("Closed Issues Activity","RGBA(87, 190," +
+            " 138, 0.7)", Object.values(data.closed)),
+          get_dataset_properties("Assigned Issues Activity","RGBA(255, 224," +
+            " 217, 0.8)", Object.values(data.assigned)),
+          get_dataset_properties("Opened Issues Activity", "RGBA(236, 151," +
+            " 52, 0.6)", data.open !== undefined?Object.values(data.open):
+            Object.values(data.opened))
+        ]
+      },
+      options: get_options('Issues Activity')
+    });
+  }
+
+  function setMergeRequestsCanvasChart(data){
+    var data_labels = new Set();
+    jQuery.each(data, function (subtype, display_filters){
+      jQuery.each(display_filters, function (filter, value) {
+        data_labels.add(filter);
+      });
+    });
+    data_labels.forEach(function (data_label) {
+      jQuery.each(data, function (subtype){
+        if(isNaN(data[subtype][data_label])){
+          data[subtype][data_label] = 0;
+        }
+      });
+    });
+    data_labels = Array.from(data_labels);
+    mergeRequestsChart = new Chart(merge_requests_canvas, {
+      type: 'line',
+      data: {
+        labels: data_labels,
+        datasets: [
+          get_dataset_properties("Merged PRs Activity","RGBA(255, 224, 217," +
+            " 0.5)",data.merged !==undefined?Object.values(data.merged):
+            new Array(data_labels.size)),
+          get_dataset_properties("Unmerged PRs Activity","RGBA(178, 52, 237," +
+            " 0.7)", data.unmerged !== undefined?Object.values(data.unmerged):
+            new Array(data_labels.size)),
+          get_dataset_properties("Opened PRs Activity", "RGBA(236, 151, 52," +
+            " 0.9)",  data.open !== undefined?Object.values(data.open):
+            (data.opened !== undefined?Object.values(data.opened):
+              new Array(data_labels.size)))
+        ]
+      },
+      options: get_options('Merge Requests Activity')
+    });
+  }
+
+  function setCanvasCharts(data){
+    setCommitsAndReviewsChart(
+      Object.keys(data.commits), Object.values(data.commits),
+      Object.keys(data.reviews), Object.values(data.reviews)
+    );
+    setIssuesCanvasChart(data.issues);
+    setMergeRequestsCanvasChart(data.merge_requests);
+  }
+
+  function toggleCanvasDisplays(data){
+    if (Object.values(data.reviews).length === 0) {
+      $('.bar-reviews-canvas').css('display', 'none');
+    }
+    else {
+      $('.bar-reviews-canvas').css('display', 'block');
+    }
+    if (Object.values(data.issues).length === 0) {
+      $('.bar-issues-canvas').css('display', 'none');
+    }
+    else {
+      $('.bar-issues-canvas').css('display', 'block');
+    }
+    if (Object.values(data.commits).length === 0) {
+      $('.bar-commits-canvas').css('display', 'none');
+    }
+    else {
+      $('.bar-commits-canvas').css('display', 'block');
+    }
+    if (Object.values(data.merge_requests).length === 0) {
+      $('.line-merge-requests-canvas').css('display', 'none');
+    }
+    else {
+      $('.line-merge-requests-canvas').css('display', 'block');
+    }
+  }
+
+  function getWeekNumber(date) {
+    var d = new Date(Date.UTC(date.getFullYear(), date.getMonth(),
+      date.getDate()));
+    var dayNum = d.getUTCDay() || 7;
+    d.setUTCDate(d.getUTCDate() + 4 - dayNum);
+    var yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1));
+    return Math.ceil((((d - yearStart) / 86400000) + 1) / 7);
+  }
+
+  function getMonthNameFromWeekNumber(year, week_number) {
+    var total_ms_count = ((week_number * 7) - 1) * 86400000;
+    var current_date = new Date();
+    var d = new Date(Date.UTC(year, current_date.getMonth(),
+      current_date.getDate()));
+    var dayNum = d.getUTCDay() || 7;
+    d.setUTCDate(d.getUTCDate() + 4 - dayNum);
+    var yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1));
+    var date = new Date(total_ms_count + yearStart.getTime());
+    return month_names[date.getMonth()];
+  }
+
+  function get_last_twelve_months_begin_end_weeks() {
+    var current_date = new Date();
+    var last_year_date = new Date(
+      current_date.getFullYear() - 1, current_date.getMonth(),
+      current_date.getDate()
+    );
+    return [current_date.getFullYear(), getWeekNumber(current_date),
+      getWeekNumber(last_year_date)];
+  }
+
+  function get_last_twelve_weeks_begin_end() {
+    var current_date = new Date();
+    var current_week = getWeekNumber(current_date);
+    var last_twelfth_week = 1;
+    if (current_week > 12) {
+      last_twelfth_week = current_week - 12;
+    } else {
+      var week_difference = 12 - current_week;
+      var month = Math.trunc((11 - week_difference) / 4);
+      var last_year_date = new Date(
+        current_date.getFullYear() - 1, month,
+        current_date.getDate());
+      last_twelfth_week = getWeekNumber(last_year_date);
+    }
+    return [current_date.getFullYear(), current_week, last_twelfth_week];
+  }
+
+  function updateCharts(data, hoster_type, display_type) {
+    if(commitsChart){
+      commitsChart.destroy();
+      reviewsChart.destroy();
+      issuesChart.destroy();
+      mergeRequestsChart.destroy();
+    }
+    var hoster_stats = data.statistics[hoster_type];
+    var charts_data = {
+      issues: new Map(),
+      commits: new Map(),
+      merge_requests: new Map(),
+      reviews: new Map(),
+    };
+    var issue_stats, commits_stats, prs_stats, reviews_stats, current_year,
+        current_week;
+    if (display_type === "yearly") {
+
+      jQuery.each(hoster_stats, function (repo_name, repo_stats) {
+        issue_stats = repo_stats.issues;
+        jQuery.each(issue_stats, function (issue_type, years) {
+          if (charts_data.issues[issue_type] === undefined) {
+            charts_data.issues[issue_type] = new Map();
+          }
+          jQuery.each(years, function (year, week_numbers) {
+            jQuery.each(week_numbers, function (
+              week_number, weekdays) {
+              jQuery.each(weekdays, function (
+                weekday, issues) {
+                if (isNaN(charts_data.issues[issue_type][year])) {
+                  charts_data.issues[issue_type][year] = 0;
+                }
+                charts_data.issues[issue_type][year] +=
+                  Object.keys(issues).length;
+              });
+
+            });
+          });
+        });
+
+        prs_stats = repo_stats.prs || repo_stats.merge_requests;
+        jQuery.each(prs_stats, function (pr_type, years) {
+          if (charts_data.merge_requests[pr_type] === undefined) {
+            charts_data.merge_requests[pr_type] = new Map();
+          }
+          jQuery.each(years, function (year, week_numbers) {
+            jQuery.each(week_numbers, function (
+              week_number, weekdays) {
+              jQuery.each(weekdays, function (weekday, mrs) {
+                if (isNaN(charts_data.merge_requests[pr_type][year])) {
+                  charts_data.merge_requests[pr_type][year] = 0;
+                }
+                charts_data.merge_requests[pr_type][year] +=
+                  Object.keys(mrs).length;
+              });
+
+            });
+          });
+        });
+
+        commits_stats = repo_stats.commits;
+        jQuery.each(commits_stats, function (year, week_numbers) {
+          jQuery.each(week_numbers, function (week_number, weekdays){
+            jQuery.each(weekdays, function (weekday, commits_done){
+              if (isNaN(charts_data.commits[year])) {
+                charts_data.commits[year] = 0;
+              }
+              charts_data.commits[year] +=
+                Object.keys(commits_done).length;
+            });
+          });
+        });
+
+        reviews_stats = repo_stats.reviews;
+        jQuery.each(reviews_stats, function (year, week_numbers) {
+          jQuery.each(week_numbers, function (week_number, weekdays){
+            jQuery.each(weekdays, function (weekday, reviews_done){
+              if (isNaN(charts_data.reviews[year])) {
+                charts_data.reviews[year] = 0;
+              }
+              charts_data.reviews[year] +=
+                Object.keys(reviews_done).length;
+            });
+          });
+        });
+      });
+    }
+
+    else if (display_type === "monthly") {
+      var last_twelve_months_weeks = get_last_twelve_months_begin_end_weeks();
+      current_year = last_twelve_months_weeks[0];
+      current_week = last_twelve_months_weeks[1];
+      var last_year_week = last_twelve_months_weeks[2];
+
+      jQuery.each(hoster_stats, function (repo_name, repo_stats) {
+
+        issue_stats = repo_stats.issues;
+        jQuery.each(issue_stats, function (issue_type, years) {
+          if (charts_data.issues[issue_type] === undefined) {
+            charts_data.issues[issue_type] = new Map();
+          }
+          jQuery.each(years, function (year, week_numbers) {
+            jQuery.each(week_numbers, function (week_number, weekdays) {
+              year = parseInt(year);
+              week_number = parseInt(week_number);
+              if (
+                (current_year === year &&
+                  week_number <= current_week) ||
+                (year === (current_year - 1) &&
+                  week_number >= last_year_week)) {
+                jQuery.each(weekdays, function (weekday,
+                                                issues) {
+                  var month_name
+                    = getMonthNameFromWeekNumber(year, week_number);
+                  var key = month_name + '\'' + year%100;
+                  if (isNaN(charts_data.issues[issue_type][key])) {
+                    charts_data.issues[issue_type][key] = 0;
+                  }
+                  charts_data.issues[issue_type][key] +=
+                    Object.keys(issues).length;
+                });
+              }
+            });
+          });
+        });
+
+        prs_stats = repo_stats.prs || repo_stats.merge_requests;
+        jQuery.each(prs_stats, function (pr_type, years) {
+          if (charts_data.merge_requests[pr_type] === undefined) {
+            charts_data.merge_requests[pr_type] = new Map();
+          }
+          jQuery.each(years, function (year, week_numbers) {
+            jQuery.each(week_numbers, function (week_number, weekdays) {
+              year = parseInt(year);
+              week_number = parseInt(week_number);
+              if ((current_year === year && week_number <= current_week) ||
+                (year === (current_year - 1) &&
+                  week_number >= last_year_week)) {
+                jQuery.each(weekdays, function (weekday, mrs) {
+                  var month_name
+                    = getMonthNameFromWeekNumber(year, week_number);
+                  var key = month_name + '\'' + year%100;
+                  if (isNaN(charts_data.merge_requests[pr_type][key])) {
+                    charts_data.merge_requests[pr_type][key] = 0;
+                  }
+                  charts_data.merge_requests[pr_type][key] +=
+                    Object.keys(mrs).length;
+                });
+              }
+            });
+          });
+        });
+
+        commits_stats = repo_stats.commits;
+        jQuery.each(commits_stats, function (year, week_numbers) {
+          jQuery.each(week_numbers, function (week_number, weekdays) {
+            year = parseInt(year);
+            week_number = parseInt(week_number);
+            if ((current_year === year && week_number <= current_week) ||
+              (year === (current_year - 1) && week_number >= last_year_week)) {
+              jQuery.each(weekdays, function (weekday, commits_done) {
+                var month_name
+                  = getMonthNameFromWeekNumber(year, week_number);
+                var key = month_name + '\'' + year%100;
+                if (isNaN(charts_data.commits[key])) {
+                  charts_data.commits[key] = 0;
+                }
+                charts_data.commits[key] += Object.keys(commits_done).length;
+              });
+            }
+          });
+        });
+
+        reviews_stats = repo_stats.reviews;
+        jQuery.each(reviews_stats, function (year, week_numbers) {
+          jQuery.each(week_numbers, function (week_number, weekdays) {
+            year = parseInt(year);
+            week_number = parseInt(week_number);
+            if ((current_year === year && week_number <= current_week) ||
+              (year === (current_year - 1) && week_number >= last_year_week)) {
+              jQuery.each(weekdays, function (weekday, reviews_done) {
+                var month_name = getMonthNameFromWeekNumber(year, week_number);
+                var key = month_name + '\'' + year%100;
+                if (isNaN(charts_data.reviews[key])) {
+                  charts_data.reviews[key] = 0;
+                }
+                charts_data.reviews[key] += Object.keys(reviews_done).length;
+              });
+            }
+          });
+        });
+      });
+    }
+
+    else {
+
+      var last_twelve_weeks = get_last_twelve_weeks_begin_end();
+      current_year = last_twelve_weeks[0];
+      current_week = last_twelve_weeks[1];
+      var last_twelfth_week = last_twelve_weeks[2];
+
+      jQuery.each(hoster_stats, function (repo_name, repo_stats) {
+
+        issue_stats = repo_stats.issues;
+        jQuery.each(issue_stats, function (issue_type, years) {
+          if (charts_data.issues[issue_type] === undefined) {
+            charts_data.issues[issue_type] = new Map();
+          }
+          jQuery.each(years, function (year, week_numbers) {
+            jQuery.each(week_numbers, function (week_number, weekdays) {
+              if ((current_year === parseInt(year) &&
+                    last_twelfth_week <= parseInt(week_number) &&
+                    parseInt(week_number) <= current_week &&
+                    current_week >= 12) ||
+                  (parseInt(year) === (current_year - 1) &&
+                    parseInt(week_number) >= last_twelfth_week &&
+                    current_week < 12)) {
+                jQuery.each(weekdays, function (weekday, issues) {
+                  var key = 'Week-' + week_number + ',' + year;
+                  if (isNaN(charts_data.issues[issue_type][key])) {
+                    charts_data.issues[issue_type][key] = 0;
+                  }
+                  charts_data.issues[issue_type][key] +=
+                    Object.keys(issues).length;
+                });
+              }
+            });
+          });
+        });
+
+        prs_stats = repo_stats.prs || repo_stats.merge_requests;
+        jQuery.each(prs_stats, function (pr_type, years) {
+          if (charts_data.merge_requests[pr_type] === undefined) {
+            charts_data.merge_requests[pr_type] = new Map();
+          }
+          jQuery.each(years, function (year, week_numbers) {
+            jQuery.each(week_numbers, function (week_number, weekdays) {
+              if ((current_year === parseInt(year) &&
+                    last_twelfth_week <= parseInt(week_number) &&
+                    parseInt(week_number) <= current_week &&
+                    current_week >= 12) ||
+                (parseInt(year) === (current_year - 1) &&
+                  parseInt(week_number) >= last_twelfth_week &&
+                  current_week < 12)) {
+                jQuery.each(weekdays, function (weekday, mrs) {
+                  var key = 'Week-' + week_number + ',' + year;
+                  if (isNaN(charts_data.merge_requests[pr_type][key])) {
+                    charts_data.merge_requests[pr_type][key] = 0;
+                  }
+                  charts_data.merge_requests[pr_type][key] +=
+                    Object.keys(mrs).length;
+                });
+              }
+            });
+          });
+        });
+
+        commits_stats = repo_stats.commits;
+        jQuery.each(commits_stats, function (year, week_numbers) {
+          jQuery.each(week_numbers, function (week_number, weekdays) {
+            if ((current_year === parseInt(year) &&
+                  last_twelfth_week <= parseInt(week_number) &&
+                  parseInt(week_number) <= current_week &&
+                  current_week >= 12) ||
+                (parseInt(year) === (current_year - 1) &&
+                  parseInt(week_number) >= last_twelfth_week &&
+                  current_week < 12)) {
+              jQuery.each(weekdays, function (weekday, commits_done) {
+                var key = 'Week-' + week_number + ',' + year;
+                if (isNaN(charts_data.commits[key])) {
+                  charts_data.commits[key] = 0;
+                }
+                charts_data.commits[key] += Object.keys(commits_done).length;
+              });
+            }
+          });
+        });
+
+        reviews_stats = repo_stats.reviews;
+        jQuery.each(reviews_stats, function (year, week_numbers) {
+          jQuery.each(week_numbers, function (week_number, weekdays) {
+            if ((current_year === parseInt(year) &&
+                  last_twelfth_week <= parseInt(week_number) &&
+                  parseInt(week_number) <= current_week &&
+                  current_week >= 12) ||
+                (parseInt(year) === (current_year - 1) &&
+                  parseInt(week_number) >= last_twelfth_week &&
+                  current_week < 12)) {
+              jQuery.each(weekdays, function (weekday, reviews_done) {
+                var key = 'Week-' + week_number + ',' + year;
+                if (isNaN(charts_data.reviews[key])) {
+                  charts_data.reviews[key] = 0;
+                }
+                charts_data.reviews[key] += Object.keys(reviews_done).length;
+              });
+            }
+          });
+        });
+      });
+    }
+
+    toggleCanvasDisplays(charts_data);
+    setCanvasCharts(charts_data);
+  }
+
+  function addEventListenerToStatisticsSelector(contrib_data){
+    hoster_selector.on('change', function () {
+      updateCharts(contrib_data, hoster_selector.val(), stats_divider.val());
+    });
+    stats_divider.on('change', function () {
+      updateCharts(contrib_data, hoster_selector.val(), stats_divider.val());
+    });
+    updateCharts(contrib_data, hoster_selector.val(), stats_divider.val());
+  }
+
+  function getContributionsCount(data){
+    var contributions_count = 0;
+    jQuery.each(data, function (years, contributions) {
+      jQuery.each(contributions, function (weeknumbers, weekdays) {
+        contributions_count += Object.keys(weekdays).length;
+      });
+    });
+    return contributions_count;
+  }
+
+  function createRepositoryCanvasChart(data){
+    var repositories_stats = {
+      repositories: [], commits: [], reviews: [], issues_opened: [],
+      assigned_issues: [], issues_closed: [], merge_requests_opened: [],
+      unmerged_merge_requests: []
+    };
+    var github_data = data.statistics.github,
+        gitlab_data = data.statistics.gitlab;
+    jQuery.each(github_data, function (repository, stats) {
+      repositories_stats.repositories.push(repository);
+      repositories_stats.commits.push(getContributionsCount(stats.commits));
+      repositories_stats.reviews.push(getContributionsCount(stats.reviews));
+      repositories_stats.issues_opened.push(getContributionsCount(
+        stats.issues === undefined? new Map(): stats.issues.open
+      ));
+      repositories_stats.assigned_issues.push(getContributionsCount(
+        stats.issues === undefined? new Map(): stats.issues.assigned
+      ));
+      repositories_stats.issues_closed.push(getContributionsCount(
+        stats.issues === undefined? new Map(): stats.issues.closed
+      ));
+      repositories_stats.merge_requests_opened.push(getContributionsCount(
+        stats.prs === undefined? new Map(): stats.prs.open
+      ));
+      repositories_stats.unmerged_merge_requests.push(getContributionsCount(
+        stats.prs === undefined? new Map(): stats.prs.unmerged
+      ));
+    });
+
+    jQuery.each(gitlab_data, function (repository, stats) {
+      repositories_stats.repositories.push(repository);
+      repositories_stats.commits.push(getContributionsCount(stats.commits));
+      repositories_stats.reviews.push(getContributionsCount(stats.reviews));
+      repositories_stats.issues_opened.push(getContributionsCount(
+        stats.issues === undefined? new Map(): stats.issues.opened
+      ));
+      repositories_stats.assigned_issues.push(getContributionsCount(
+        stats.issues === undefined? new Map(): stats.issues.assigned
+      ));
+      repositories_stats.issues_closed.push(getContributionsCount(
+        stats.issues === undefined? new Map(): stats.issues.closed
+      ));
+      repositories_stats.merge_requests_opened.push(getContributionsCount(
+        stats.merge_requests === undefined? new Map():
+          stats.merge_requests.opened
+      ));
+      repositories_stats.unmerged_merge_requests.push(getContributionsCount(
+        stats.merge_requests === undefined? new Map():
+          stats.merge_requests.unmerged
+      ));
+    });
+    setRepositoryCanvasChart(repositories_stats);
+  }
+
+  $('select').formSelect();
+  $('.user-statistics-option').on('click', function () {
+    var username = $(this).attr('username');
+    user_statistics_display.css('display', 'block');
+    $.getJSON("/static/contributors-data.json", function (data) {
+      var contrib_data = data[username];
+      contrib_data.statistics = $.parseJSON(contrib_data.statistics);
+      contrib_data.type_of_issues_worked_on = $.parseJSON(
+        contrib_data.type_of_issues_worked_on
+      );
+      contrib_data.working_on_issues_count = $.parseJSON(
+        contrib_data.working_on_issues_count
+      );
+      contrib_data.updated_at = $.parseJSON(contrib_data.updated_at);
+      createRepositoryCanvasChart(contrib_data);
+      addEventListenerToStatisticsSelector(contrib_data);
+      displayWorkedOnIssueLabels(contrib_data);
+      displayWorkingOnIssuesCount(contrib_data);
+      displayDataUpdatedDates(contrib_data);
+    }).fail(function (data, textStatus, error) {
+      console.error("Request Failed: " + textStatus + ", " + error);
+    });
+    $('.close-statistics').on('click', function () {
+      user_statistics_display.css('display', 'none');
+    });
+  });
+});
diff --git a/static/js/contributors.js b/static/js/contributors.js
new file mode 100644
index 00000000..beaa9d64
--- /dev/null
+++ b/static/js/contributors.js
@@ -0,0 +1,77 @@
+$(document).ready(function(){
+    var search_input = $('#search');
+    var close_icon = $('.contributors-section .fa-close');
+    var results_body = $('.search-results-tbody');
+    var searched_keyword = null;
+
+    function appendChildren(element, username, el_result_value,
+                            hide_all_contributors){
+        var result_td = $('<tr></tr>').text(el_result_value);
+        result_td.id = "td-" + username;
+        if(hide_all_contributors){
+            result_td.on('click', function(){
+                var row_id = result_td.id;
+                var login = row_id.replace('td-', '');
+                $('.contributor-card').css('display', 'none');
+                var contrib_card = $('[login=' + login +']');
+                if(contrib_card.hasClass('meta-reviewer')){
+                    contrib_card.css('display', 'flex');
+                }
+                else{
+                    contrib_card.css('display', 'block');
+                }
+                $('.search-results').css('display', 'none');
+            });
+        }
+        element.append(result_td);
+    }
+
+    search_input.on('keypress keyup', function(){
+        searched_keyword = search_input.val();
+        if(searched_keyword === ''){
+            $('.search-results').css('display', 'none');
+            close_icon.css('display', 'none');
+        }
+        else {
+            $('.search-results').css('display', 'block');
+            close_icon.css('display', 'block');
+            var search_by_login = $('[login^=' + searched_keyword +']');
+            var search_by_name = $('[name^=' + searched_keyword +']');
+            var results_tbody_tr = $('.search-results-tbody tr');
+            results_tbody_tr.remove();
+            if(search_by_login.length + search_by_name.length === 0 ){
+                appendChildren(results_body, null, 'No results found!', false);
+            }
+            else {
+                var all_results = search_by_login.add(search_by_name);
+                for(var contrib in all_results.get()){
+                    if(all_results[contrib]){
+                        var login = all_results[contrib].getAttribute('login');
+                        var name = all_results[contrib].getAttribute('name');
+                        var result_value = null;
+                        if(name){
+                            result_value = login + " (" + name + ")";
+                        }
+                        else {
+                            result_value = login;
+                        }
+                        appendChildren(results_body, login, result_value, true);
+                    }
+                }
+            }
+        }
+    });
+
+    close_icon.on('click', function(){
+        var all_contrib_cards = $('.contributor-card');
+        if(all_contrib_cards.hasClass('meta-reviewer')){
+            all_contrib_cards.css('display', 'flex');
+        }
+        else {
+            all_contrib_cards.css('display', 'block');
+        }
+        close_icon.css('display', 'none');
+        search_input.val(null);
+        $('.search-results').css('display', 'none');
+    });
+});
diff --git a/static/js/forms.js b/static/js/forms.js
new file mode 100644
index 00000000..80d02dc7
--- /dev/null
+++ b/static/js/forms.js
@@ -0,0 +1,102 @@
+/* globals Cookies */
+$(document).ready(function () {
+
+  var community_google_form_op = $('.community-google-form-op');
+  var newcomer_promotion_form_op = $('.newcomer-promotion-form-op');
+  var calendar_event_form_op = $('.calendar-event-form-op');
+  var get_issue_assigned_form_op = $('.get-issue-assigned-form-op');
+  var participated_in_gsoc_form_op = $('.participated-in-gsoc-form-op');
+  var mentor_students_form_op = $('.mentor-students-form-op');
+
+  var community_google_form = $('.community-google-form');
+  var newcomer_promotion_form = $('.newcomer-promotion-form');
+  var calendar_event_form = $('.calendar-event-form');
+  var get_issue_assigned_form = $('.get-issue-assigned-form');
+  var participated_in_gsoc_form = $('.participated-in-gsoc-form');
+  var mentor_students_form = $('.mentor-students-form');
+
+  var is_user_authenticated = Cookies.get('authenticated');
+  var authenticated_username = Cookies.get('username');
+
+  var username_input = $('[name$=user]').add($('.newcomer-promotion-form' +
+    ' [name$=username]'));
+  username_input.attr('value', authenticated_username || 'Anonymous User');
+  username_input.attr('disabled', true);
+
+  $('.community-form form').attr(
+    'action',window.location.pathname +
+                   '?form_submitted=True&form_type=community'
+  );
+
+  $.getJSON("/static/contributors-data.json", function (data) {
+    var contributor_data = data[authenticated_username];
+    var teams = contributor_data.teams;
+    if(teams.length === 1){
+      community_google_form_op.get(0).remove();
+      calendar_event_form_op.get(0).remove();
+      mentor_students_form_op.get(0).remove();
+      community_google_form.get(0).remove();
+      calendar_event_form.get(0).remove();
+      mentor_students_form.get(0).remove();
+    }
+  });
+
+  function display_error_message(message){
+    if(message){
+      $('.important-message').text(message);
+    }
+    else {
+      $('.important-message').text('You tried to open a form, which is ' +
+          'available to only authenticated users. Please join the community' +
+          ' or Login(if already a member of organization)');
+    }
+    $('.form-submission-popup').css('display', 'flex');
+  }
+
+  function display_form_or_error(form_object){
+    if(is_user_authenticated && authenticated_username){
+      $('.community-form').css('display', 'flex');
+      form_object.css('display', 'block');
+    }
+    else {
+      display_error_message();
+    }
+  }
+
+  community_google_form_op.on('click', function () {
+    display_form_or_error(community_google_form);
+  });
+
+  newcomer_promotion_form_op.on('click', function () {
+    display_form_or_error(newcomer_promotion_form);
+  });
+
+  calendar_event_form_op.on('click', function () {
+    display_form_or_error(calendar_event_form);
+  });
+
+  get_issue_assigned_form_op.on('click', function () {
+    display_form_or_error(get_issue_assigned_form);
+  });
+
+  participated_in_gsoc_form_op.on('click', function () {
+    display_form_or_error(participated_in_gsoc_form);
+  });
+
+  mentor_students_form_op.on('click', function () {
+    display_form_or_error(mentor_students_form);
+  });
+
+  $('.community-form :input').focusin(function () {
+    if (is_user_authenticated===undefined &&
+          authenticated_username===undefined) {
+      $('.community-form').css('display', 'none');
+      display_error_message();
+    }
+  });
+
+  $('.user_disabled_input').focusin(function () {
+    display_error_message('Sorry! But you are not allowed to change this' +
+      ' field value.');
+  });
+});
diff --git a/static/js/index.js b/static/js/index.js
new file mode 100644
index 00000000..f8a9383a
--- /dev/null
+++ b/static/js/index.js
@@ -0,0 +1,99 @@
+/* globals Chart */
+$(document).ready(function(){
+    $(".clickable-row").click(function() {
+        window.location = $(this).data("href");
+    });
+
+    var chart_type_selector = $('#chart-type');
+    var curChart;
+
+    function setChart(labels, openedData, closedData, type) {
+      var ctx = document.getElementById("canvas");
+
+      curChart = new Chart(ctx, {
+        type: 'line',
+        data: {
+          labels: labels,
+          datasets: [{
+            label: "Issues Opened",
+            backgroundColor: "RGBA(33, 150, 243, 0.2)",
+            borderColor: "RGBA(33, 150, 243, 1)",
+            data: openedData,
+            fill: true,
+          }, {
+            label: "Issues Closed",
+            backgroundColor: "RGBA(244, 67, 54, 0.2)",
+            borderColor: "RGBA(244, 67, 54, 1)",
+            data: closedData,
+            fill: true,
+          }]
+        },
+        options: {
+          responsive: true,
+          title: {
+            display: true,
+            text: 'Community Activity'
+          },
+          tooltips: {
+            mode: 'index',
+            intersect: false,
+          },
+          hover: {
+            mode: 'nearest',
+            intersect: true
+          },
+          scales: {
+            xAxes: [{
+              display: true,
+              scaleLabel: {
+                display: true,
+                labelString: type
+              }
+            }],
+            yAxes: [{
+              display: true,
+              scaleLabel: {
+                display: true,
+                labelString: 'Number'
+              }
+            }]
+          }
+        }
+      });
+    }
+
+    function updateChart(type) {
+      if(curChart){ curChart.destroy(); }
+
+      $.getJSON("/static/activity-data.js",
+        function(data) {
+          var labels, openedData, closedData;
+          if(type === "Month") {
+            labels = data.year.labels;
+            openedData = data.year.opened;
+            closedData = data.year.closed;
+          }
+          else if(type === "Week") {
+            labels = data.month.labels;
+            openedData = data.month.opened;
+            closedData = data.month.closed;
+          }
+          else {
+            labels = data.week.labels;
+            openedData = data.week.opened;
+            closedData = data.week.closed;
+          }
+          setChart(labels, openedData, closedData, type);
+      })
+      .fail(function(data, textStatus, error) {
+        var err = textStatus + ", " + error;
+        console.error("Request Failed: " + err);
+      });
+    }
+
+    chart_type_selector.on('change', function(){
+        updateChart($('#chart-type').val());
+        });
+
+    updateChart(chart_type_selector.val());
+});
diff --git a/static/js/main.js b/static/js/main.js
new file mode 100644
index 00000000..f9b2e2c6
--- /dev/null
+++ b/static/js/main.js
@@ -0,0 +1,149 @@
+/* globals Cookies, netlify, URLSearchParams */
+$(document).ready(function(){
+
+    var login_user_el = $('.login-user');
+    var logout_user_el = $('.user-logout');
+
+    var urlParams = new URLSearchParams(location.search);
+    var formSubmitted = urlParams.get('form_submitted');
+    var formType = urlParams.get('form_type');
+
+    if(formSubmitted==='True'){
+        var message = '';
+        if(formType==='login'){
+            message = 'You request to join community, form has been' +
+              ' submitted! You will receive an invite email within 24hrs, if' +
+              ' all the validation checks are passed. Else, you will receive' +
+              ' an email with the information regarding what all checks got' +
+              ' failed!';
+        }
+        else if(formType==='community'){
+            message = 'Your request has been received and will be soon' +
+              ' processed. You will receive an email notifying you whether' +
+              ' the validation checks are passed or not. If not, the email' +
+              ' will contain the validation errors. Correct them, if any';
+        }
+        $('.important-message').text(message);
+        $('.form-submission-popup').css('display', 'block');
+    }
+
+    function activate_dropdown(){
+        if ($('nav').width() < 992 ){
+            $(".dropdown-trigger-sidenav").dropdown({coverTrigger: false});
+        }
+        else {
+            $(".dropdown-trigger").dropdown({hover: true,
+                                             constrainWidth: false,
+                                             coverTrigger: false});
+        }
+    }
+
+    function check_user_authenticated_or_not() {
+        if(Cookies.get('authenticated')){
+            modify_html_elements('none', 'none','block', 'block');
+        }
+    }
+
+    function get_error_message(oauth_provider, err){
+        return 'Error Authenticating with ' + oauth_provider + '. ' + err +
+            '. Please try again later!';
+    }
+
+    function display_error_message(oauth_provider, error_info) {
+        $('.error-message').text(get_error_message(oauth_provider, error_info));
+        $('.oauth-error').css('display', 'block');
+    }
+
+    function modify_html_elements(popup_form_display, login_option_display,
+                                  logout__option_display,
+                                  form_option_display) {
+        $('.form-popup').css('display', popup_form_display);
+        login_user_el.css('display', login_option_display);
+        logout_user_el.css('display', logout__option_display);
+        $('.forms-dropdown-option').css('display', form_option_display);
+    }
+
+    function manipulate_web_page_data(oauth_provider, http_response_text) {
+        var json_data = JSON.parse(http_response_text);
+        if (json_data.valid) {
+            // Cookies expires in 3 days
+            Cookies.set('authenticated', true, {expires: 3});
+            Cookies.set('username', json_data.user, {expires: 3});
+            modify_html_elements('none', 'none','block', 'block');
+        }
+        else {
+            display_error_message(oauth_provider, json_data.message);
+        }
+    }
+
+    function validate_user(oauth_provider, access_token){
+        var url = 'https://webservices.coala.io/'+ oauth_provider + '/' +
+            access_token +'/validate';
+        var xhttp = new XMLHttpRequest();
+        xhttp.onreadystatechange = function() {
+            if (this.readyState === 4 && this.status === 200) {
+                manipulate_web_page_data(oauth_provider, this.responseText);
+            }
+        };
+        xhttp.open("GET", url, true);
+        xhttp.send();
+    }
+
+    function login_with(oauth_provider){
+        var authenticator = new netlify.default({});
+        authenticator.authenticate(
+            {
+                provider:oauth_provider,
+                scope: oauth_provider==='github'?"user":"api"
+            }, function(err, data) {
+                if(err){
+                    display_error_message(oauth_provider, err);
+                }
+                else {
+                    validate_user(data.provider, data.token);
+                }
+            }
+        );
+    }
+
+    activate_dropdown();
+
+    check_user_authenticated_or_not();
+
+    $('.sidenav').sidenav();
+    $('select').formSelect();
+
+    $(window).resize(function(){
+        activate_dropdown();
+    });
+
+    $('#current-year').html(new Date().getFullYear());
+
+    login_user_el.click(function () {
+        $('.form-popup').css('display', 'block');
+    });
+
+    $('.close-form').click(function () {
+        $('.form-popup').css('display', 'none');
+        $('.form-submission-popup').css('display', 'none');
+        $('.oauth-error').css('display', 'none');
+        $('.community-form').css('display', 'none');
+        $('.community-form form').css('display', 'none');
+    });
+
+    logout_user_el.click(function () {
+        Cookies.remove('authenticated');
+        Cookies.remove('username');
+        modify_html_elements('none', 'block','none', 'none');
+    });
+
+    $('.login-with-github').click(function(e) {
+        e.preventDefault();
+        login_with('github');
+    });
+
+    $('.login-with-gitlab').click(function(e) {
+        e.preventDefault();
+        login_with('gitlab');
+    });
+});
diff --git a/static/js/timeago.js b/static/js/timeago.js
new file mode 100644
index 00000000..1e214994
--- /dev/null
+++ b/static/js/timeago.js
@@ -0,0 +1,31 @@
+$(document).ready(function(){
+    function generateTimeString(timestamp) {
+        var sec = ((new Date()).getTime() / 1000) - parseInt(timestamp);
+        var min = sec / 60;
+        var hour = min / 60;
+        var day = hour / 24;
+
+        var timeString = '';
+        if (day >= 1) {
+            timeString = Math.round(day) + ' days ago';
+        } else if (hour >= 1) {
+            timeString = Math.round(hour) + ' hours ago';
+        } else if (min >= 1) {
+            timeString = Math.round(min) + ' minutes ago';
+        } else {
+            timeString = Math.round(sec) + ' seconds ago';
+        }
+
+        return timeString;
+    }
+
+    function updateTimeAgo(time) {
+        time.text(" " + generateTimeString(time.attr('data-time')));
+    }
+
+    function loadTimeElements() {
+        updateTimeAgo($('#time'));
+    }
+
+    loadTimeElements();
+});
\ No newline at end of file
diff --git a/static/main.css b/static/main.css
deleted file mode 100644
index d2f410e3..00000000
--- a/static/main.css
+++ /dev/null
@@ -1,7 +0,0 @@
-.student {
-    padding-bottom: 20px;
-}
-
-.students {
-    list-style: none;
-}
diff --git a/static/timeago.js b/static/timeago.js
deleted file mode 100644
index d6285487..00000000
--- a/static/timeago.js
+++ /dev/null
@@ -1,30 +0,0 @@
-function generateTimeString(timestamp) {
-  var sec = ((new Date()).getTime() / 1000) - parseInt(timestamp);
-  var min = sec / 60;
-  var hour = min / 60;
-  var day = hour / 24;
-
-  var timeString = '';
-  if (day >= 1) {
-    timeString = Math.round(day) + ' days ago';
-  } else if (hour >= 1) {
-    timeString = Math.round(hour) + ' hours ago';
-  } else if (min >= 1) {
-    timeString = Math.round(min) + ' minutes ago';
-  } else {
-    timeString = Math.round(sec) + ' seconds ago';
-  }
-
-  return timeString;
-}
-
-function updateTimeAgo(time, ago) {
-  ago.innerHTML = generateTimeString(time.getAttribute('data-time'));
-}
-
-function loadTimeElements() {
-  var time = document.getElementById('time');
-  var ago = document.getElementById('ago');
-
-  updateTimeAgo(time, ago);
-}
diff --git a/templates/activity.html b/templates/activity.html
deleted file mode 100644
index a16da76f..00000000
--- a/templates/activity.html
+++ /dev/null
@@ -1,39 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <title>Community Activity</title>
-      <style>
-        canvas {
-        -moz-user-select: none;
-        -webkit-user-select: none;
-        -ms-user-select: none;
-        }
-      </style>
-      <meta charset="utf-8">
-      <meta content="text/html">
-  </head>
-  <body>
-    <h1>Community Activity</h1>
-    <br>
-    <br>
-    <div style="width:75%;">
-      <canvas id="canvas"></canvas>
-    </div>
-    <select id="chart-type">
-      <option value="Month">Year</option>
-      <option value="Week">Month</option>
-      <option value="Day">Week</option>
-    </select>
-    <br>
-    <br>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.bundle.js"></script>
-    <script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
-    <script src="/static/charts.js"></script>
-    <script>
-      $('#chart-type').on('change', function(){
-        updateChart($('#chart-type').val())
-        });
-        updateChart($('#chart-type').val());
-    </script>
-  </body>
-</html>
diff --git a/templates/base.html b/templates/base.html
new file mode 100644
index 00000000..05dece2e
--- /dev/null
+++ b/templates/base.html
@@ -0,0 +1,231 @@
+<!DOCTYPE html>
+{% load staticfiles %}
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta content="text/html">
+    <title>{% block title %}{% endblock %}</title>
+    <link rel="shortcut icon" href="{% static 'images/favicon.ico' %}" type="image/x-icon">
+    <link href="//fonts.googleapis.com/css?family=Ubuntu+Mono:400,700&display=swap" rel="stylesheet">
+    <link href="//cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" rel="stylesheet">
+    <link crossorigin="anonymous" href="//stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" rel="stylesheet">
+    <link rel="stylesheet" href="{% static 'css/main.css' %}">
+    {% block add_css_files %}{% endblock %}
+
+    <script crossorigin="anonymous" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" src="//code.jquery.com/jquery-3.4.1.min.js"></script>
+    <script src="//cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
+    <!-- Nelify's authentiation library -->
+    <script src="//unpkg.com/netlify-auth-providers"></script>
+    <script src="//cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
+    <script src="{% static 'js/main.js' %}"></script>
+    <script src="{% static 'js/forms.js' %}"></script>
+    {% block add_js_files %}{% endblock %}
+
+  </head>
+  <body>
+    <nav>
+      <div class="nav-wrapper bold-text">
+        <a href="/" class="brand-logo">
+          <img src="{% static 'images/os_community_logo.png' %}" alt="OpenSource Community Logo">
+        </a>
+        <a href="#" data-target="mobile-menu" class="sidenav-trigger"><i class="fa fa-bars"></i></a>
+        <ul class="right hide-on-med-and-down nav-menu-font-size">
+          <li><a href="{% url 'index' %}" class="nav-menu-font-size">Home</a></li>
+          <li><a href="/#about" class="nav-menu-font-size">About</a></li>
+          <li><a href="{% url 'join-community' %}" class="nav-menu-font-size">Join</a></li>
+          <li><a href="{{ org.blog_url }}" target="_blank" class="nav-menu-font-size">Blog</a></li>
+          <li><a class="dropdown-trigger nav-menu-font-size" href="#organisation" data-target="organisation-dropdown">Organisation <i class="fa fa-caret-down"></i></a></li>
+          <li><a class="dropdown-trigger nav-menu-font-size" href="#contributors" data-target="contributors-dropdown">Contributors <i class="fa fa-caret-down"></i></a></li>
+          <li><a class="dropdown-trigger nav-menu-font-size" href="#openhub" data-target="openhub-dropdown">OpenHub <i class="fa fa-caret-down"></i></a></li>
+          <li><a class="dropdown-trigger nav-menu-font-size forms-dropdown-option display-none" href="#forms" data-target="forms-dropdown">Forms <i class="fa fa-caret-down"></i></a></li>
+          <li><a href="{{ org.twitter_url }}" target="_blank"><i class="fa fa-twitter social-icons"></i></a></li>
+          <li><a href="{{ org.facebook_url }}" target="_blank"><i class="fa fa-facebook-f social-icons"></i></a></li>
+          <li><a href="{{ org.repo_url }}" target="_blank"><i class="fa fa-github social-icons"></i></a></li>
+          <li><a class="dropdown-trigger" href="#user" data-target="user-dropdown"><i class="fa fa-user social-icons"></i></a></li>
+        </ul>
+      </div>
+    </nav>
+
+    <ul class="sidenav bold-text" id="mobile-menu">
+      <li><a href="/#about" class="nav-menu-font-size">About</a></li>
+      <li><a href="{% url 'join-community' %}" class="nav-menu-font-size">Join</a></li>
+      <li><a href="{{ org.blog_url }}" target="_blank" class="nav-menu-font-size">Blog</a></li>
+      <li><a class="dropdown-trigger-sidenav nav-menu-font-size" href="#organisation" data-target="organisation-dropdown">Organisation <i class="fa fa-caret-down"></i></a></li>
+      <li><a class="dropdown-trigger-sidenav nav-menu-font-size" href="#contributors" data-target="contributors-dropdown">Contributors <i class="fa fa-caret-down"></i></a></li>
+      <li><a class="dropdown-trigger-sidenav nav-menu-font-size" href="#openhub" data-target="openhub-dropdown">OpenHub <i class="fa fa-caret-down"></i></a></li>
+      <li class=" forms-dropdown-option display-none">
+        <a class="dropdown-trigger-sidenav nav-menu-font-size" href="#forms"
+           data-target="forms-dropdown">
+          Forms <i class="fa fa-caret-down"></i>
+        </a>
+      </li>
+      <li><a href="{{ org.twitter_url }}" target="_blank"><i class="fa fa-twitter social-icons" aria-hidden="true"></i></a></li>
+      <li><a href="{{ org.facebook_url }}" target="_blank"><i class="fa fa-facebook-f social-icons"></i></a></li>
+      <li><a href="{{ org.repo_url }}" target="_blank"><i class="fa fa-github social-icons"></i></a></li>
+      <li><a class="dropdown-trigger-sidenav" href="#user" data-target="user-dropdown"><i class="fa fa-user social-icons"></i><i class="fa fa-caret-down"></i></a></li>
+    </ul>
+
+    <ul id="organisation-dropdown" class="dropdown-content">
+      <li><a href="#">Teams</a></li>
+      <li><a href="{% url 'community-data' %}">Contributors Information</a></li>
+      <li><a href="#">Mentors</a></li>
+      <li><a href="{% url 'community-gci' %}">Google Code-in Students</a></li>
+      <li><a href="{% url 'inactive_issues_json' %}" title="List of all the issues on organization's main repository on which assignee has not shown any activity for more than 2 months.">Inactive issues</a></li>
+      <li><a href="{% url 'unassigned_issues_activity_json' %}" title="List of all the issues on organization main repository on which someone has opened a pull request without getting assigned to it.">Unassigned issues activity</a></li>
+      <li><a href="{% url 'ci_build' %}">Project CI Build</a></li>
+      {% if isTravis %}
+        <li><a href="{{ travisLink }}" title="This website was built automatically using Travis CI.">TravisCI build info</a></li>
+      {% endif %}{# if isTravis #}
+    </ul>
+
+    <ul id="contributors-dropdown" class="dropdown-content">
+      <li><a href="{% url 'community-gamification' %}">Gamification Leaderboard</a></li>
+      <li><a href="{% url 'meta_review_data' %}">Meta-review</a></li>
+    </ul>
+
+    <ul id="openhub-dropdown" class="dropdown-content">
+      <li><a href="{% url 'community-openhub' %}">Org. Portfolio Projects</a></li>
+      <li><a href="{% url 'community-model' %}">Imported data</a></li>
+    </ul>
+
+    <ul id="forms-dropdown" class="dropdown-content">
+      <li class="community-google-form-op">
+        <a>Upload a community google form</a>
+      </li>
+      <li class="newcomer-promotion-form-op">
+        <a>Newcomer promotion request form</a>
+      </li>
+      <li class="calendar-event-form-op">
+        <a>Add an Event in Calendar?</a>
+      </li>
+      <li class="get-issue-assigned-form-op">
+        <a>Want to work on an issue?</a>
+      </li>
+      <li class="participated-in-gsoc-form-op">
+        <a>Participated in GSoC with {{ org.name }}?</a>
+      </li>
+      <li class="mentor-students-form-op">
+        <a>Mentor students in GSoC?</a>
+      </li>
+    </ul>
+
+    <ul id="user-dropdown" class="dropdown-content">
+      <li class="login-user"><a>Login</a></li>
+      <li class="user-logout"><a>Logout</a></li>
+    </ul>
+
+    <div class="apply-flex form-popup">
+      <div class="login-form">
+        <div class="apply-flex close-form">
+          <i class="fa fa-times" aria-hidden="true"></i>
+        </div>
+        <div class="oauth-error">
+          <p class="error-message"></p>
+        </div>
+        <span class="apply-flex organizations">
+          <img src="{{ org.logo_url }}" class="org-logo" alt="org-logo">
+          <i class="fa fa-plus" aria-hidden="true"></i>
+          <img src="//flaviocopes.com/netlify/banner.png" class="netlify-image" alt="netlify-logo">
+        </span>
+        <div class="apply-flex oauth-providers">
+          <a class="waves-effect waves-light btn-large login-with-github">
+            <i class="fa fa-github left" aria-hidden="true"></i>
+            Login with GitHub
+          </a>
+          <a class="waves-effect waves-light btn-large login-with-gitlab">
+            <i class="fa fa-gitlab left" aria-hidden="true"></i>
+            Login with GitLab
+          </a>
+        </div>
+      </div>
+    </div>
+
+    <div class="apply-flex form-submission-popup">
+      <div class="form-submission-message">
+        <div class="apply-flex close-form">
+          <i class="fa fa-times" aria-hidden="true"></i>
+        </div>
+        <span class="apply-flex organizations">
+          <img src="{{ org.logo_url }}" class="org-logo" alt="org-logo">
+          <i class="fa fa-plus" aria-hidden="true"></i>
+          <img src="//flaviocopes.com/netlify/banner.png" class="netlify-image" alt="netlify-logo">
+        </span>
+        <div class="apply-flex message text-justify">
+          <h6 class="important-message"></h6>
+          <h6>Enjoy Coding 'n' Learning</h6>
+        </div>
+      </div>
+    </div>
+
+    <div class="main-content">
+      {% block main-content %}
+      {% endblock %}
+    </div>
+
+    <div class="community-form apply-flex center-content display-none">
+      <div class="apply-flex close-form">
+        <i class="fa fa-times" aria-hidden="true"></i>
+      </div>
+      {% include 'community_forms.html' %}
+    </div>
+
+  <footer class="page-footer">
+    <div class="row">
+      <div class="col m3 s12">
+        <h5 class="white-text fine">Site Links</h5>
+          <ul>
+            <li><a class="grey-text text-lighten-3 bold-text" target="_blank" href="{{ org.docs }}">Documentation</a></li>
+            <li><a class="grey-text text-lighten-3 bold-text" target="_blank" href="{{ org.newcomer_docs }}">Newcomer Docs</a></li>
+            <li><a class="grey-text text-lighten-3 bold-text" target="_blank" href="{{ org.coc }}">Code of Conduct</a></li>
+            <li><a class="grey-text text-lighten-3 bold-text" target="_blank" href="{{ org.blog_url }}">Blog</a></li>
+          </ul>
+      </div>
+      <div class="col m9 s12 center">
+        <div class="center">
+          <h3 class="fine white-text">
+            <span>
+              <img class="footer-logo" src="{{ org.logo_url }}" alt="{{ org.name }}">
+            </span>
+            <span>{{ org.name }}</span>
+          </h3>
+        </div>
+        <div class="center footer-icons">
+          <span class="icon">
+            <a href="{{ org.twitter_url }}" target="_blank" class="btn center social-buttons">
+              <i class="fa fa-twitter" aria-hidden="true">
+                Follow us on Twitter
+              </i>
+            </a>
+          </span>
+          <span class="icon">
+            <a href="{{ org.gitter_chat }}" target="_blank" class="btn center social-buttons">
+              <i class="fa fa-commenting-o" aria-hidden="true">
+                Join Chat on Gitter
+              </i>
+            </a>
+          </span>
+          <span class="icon">
+            <a href="{{ org.github_core_repo }}" target="_blank" class="btn center social-buttons">
+              <i class="fa fa-github" aria-hidden="true">
+                Star us on GitHub
+              </i>
+            </a>
+          </span>
+        </div>
+      </div>
+      </div>
+    <div class="footer-copyright bold-text">
+      <div class="container ">
+        <span class="left">
+          ©
+          <span id="current-year"></span>
+          {{ org.name }}
+        </span>
+        <span class="grey-text text-lighten-4 right">{{ org.licence_type }}</span>
+      </div>
+    </div>
+  </footer>
+
+  </body>
+</html>
diff --git a/templates/build_logs.html b/templates/build_logs.html
new file mode 100644
index 00000000..945150f7
--- /dev/null
+++ b/templates/build_logs.html
@@ -0,0 +1,73 @@
+{% extends 'base.html' %}
+{% load staticfiles %}
+{% block title_block %}
+  Community | Build Logs
+{% endblock %}
+
+{% block add_css_files %}
+<link rel="stylesheet" href="{% static 'css/build_logs.css' %}">
+{% endblock %}
+
+{% block add_js_files %}
+<script src="{% static 'js/build_logs.js' %}"></script>
+{% endblock %}
+
+{% block main-content %}
+  <div class="web-page-details apply-flex center-content">
+    <h3 style="padding-right: 15px">~</h3>
+    <div class="page-name">
+      <h3>Project CI Build</h3>
+    </div>
+    <h3 style="padding-left: 15px">~</h3>
+  </div>
+
+  <div class="build-info-section apply-flex center-content">
+    <section>
+      <h3>Information</h3>
+      <div class="build-information">
+        {% for key, value in build_info.items %}
+        <p>{{ key }}: {{ value }}</p>
+        {% endfor %}{# for key, value in build_info.items #}
+      </div>
+    </section>
+  </div>
+
+
+  <div class="build-logs-section apply-flex center-content">
+    <section>
+      <div class="section-header">
+        <h3>Logs</h3>
+        <div class="form-fields">
+          <form>
+            <i class="fa fa-search social-icons small-screen"></i>
+            <div class="input-field apply-flex center-content search-field">
+              <i class="fa fa-search social-icons"></i>
+              <input id="search" type="search" required autocomplete="off">
+              <i class="fa fa-close social-icons"></i>
+            </div>
+            <div class="input-field log-chooser">
+              <select id="log-chooser-input">
+                <option value="logs" selected>All logs</option>
+                <optgroup label="Log Levels-">
+                  <option value="INFO">INFO</option>
+                  <option value="DEBUG">DEBUG</option>
+                  <option value="ERROR">ERROR</option>
+                  <option value="WARNING">WARNING</option>
+                  <option value="CRITICAL">CRITICAL</option>
+                </optgroup>
+              </select>
+            </div>
+          </form>
+        </div>
+      </div>
+      <div class="build-logs">
+        {% if logs_stored %}
+        <p>Great! Wait for build logs to get displayed.</p>
+        {% else %}
+        <p>No logs found! Please run '.ci/build.sh' on the project.</p>
+        {% endif %}{# if logs_stored #}
+      </div>
+    </section>
+  </div>
+
+{% endblock %}
diff --git a/templates/community_forms.html b/templates/community_forms.html
new file mode 100644
index 00000000..66071242
--- /dev/null
+++ b/templates/community_forms.html
@@ -0,0 +1,418 @@
+<form name="{{ community_google_form_name }}" method="post"
+      netlify-honeypot="bot-field" class="community-google-form display-none"
+      data-netlify="true" action="/">
+  <h5 class="text-center custom-green-color-font bold-text">
+    Community Google Form Details
+  </h5>
+  {% csrf_token %}
+  {% for field in community_google_form %}
+    <div class="row">
+      <div class="input-field col s12">
+        {% if field.name == 'user' %}
+        <p>{{ field.label_tag }}</p>
+        {% else %}
+        {{ field.label_tag }}
+        {% endif %}
+        {{ field }}
+        {% if field.help_text %}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ field.help_text }}</i>
+        {% endif %}
+      </div>
+    </div>
+  {% endfor %}
+  <div class="validation-checkboxes">
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>I am a member of {{ org.name }} developers group.</span>
+      </label>
+    </p>
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>All of the above information provided by me has no false
+          entries. If so, I am liable of getting blacklisted.</span>
+      </label>
+    </p>
+    <p style="display: none">
+      <label>
+        <input type="checkbox" name="bot-field">
+        <span>I am a bot</span>
+      </label>
+    </p>
+    <p>
+      <strong>
+        Note: You will receive an email within 24 hrs, if any of the
+        validation checks are not passed.
+      </strong>
+    </p>
+  </div>
+  <div class="apply-flex center-content submit-btn">
+    <input class="waves-effect waves-light btn-large large-font" type="submit" value="Submit">
+  </div>
+</form>
+
+
+<form name="{{ community_event_form_name }}" method="post"
+      netlify-honeypot="bot-field" class="calendar-event-form display-none"
+      data-netlify="true" action="/">
+  <h5 class="text-center custom-green-color-font bold-text">
+    Community Event Details
+  </h5>
+  {% csrf_token %}
+  {% for field in community_event_form %}
+    <div class="row">
+      <div class="input-field col s12">
+        {% if field.name == 'user' %}
+        <p>{{ field.label_tag }}</p>
+        {% else %}
+        {{ field.label_tag }}
+        {% endif %}
+        {{ field }}
+        {% if field.help_text %}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ field.help_text }}</i>
+        {% endif %}
+      </div>
+    </div>
+  {% endfor %}
+  <div class="validation-checkboxes">
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>I am a member of {{ org.name }} developers group.</span>
+      </label>
+    </p>
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>All of the above information provided by me has no false
+          entries. If so, I am liable of getting blacklisted.</span>
+      </label>
+    </p>
+    <p style="display: none">
+      <label>
+        <input type="checkbox" name="bot-field">
+        <span>I am a bot</span>
+      </label>
+    </p>
+    <p>
+      <strong>
+        Note: You will receive an email within 24 hrs, if any of the
+        validation checks are not passed.
+      </strong>
+    </p>
+  </div>
+  <div class="apply-flex center-content submit-btn">
+    <input class="waves-effect waves-light btn-large large-font" type="submit" value="Submit">
+  </div>
+</form>
+
+<form name="{{ organization_mentor_form_name }}" method="post"
+      netlify-honeypot="bot-field" class="mentor-students-form display-none"
+      data-netlify="true" action="/">
+  <h5 class="text-center custom-green-color-font bold-text">
+    Mentoring Program Details
+  </h5>
+  {% csrf_token %}
+  {% for field in organization_mentor_form %}
+    <div class="row">
+      <div class="input-field col s12">
+        <p>{{ field.label_tag }}</p>
+        {{ field }}
+        {% if field.help_text %}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ field.help_text }}</i>
+        {% endif %}
+      </div>
+    </div>
+  {% endfor %}
+  <div class="validation-checkboxes">
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>I am a member of {{ org.name }} developers group.</span>
+      </label>
+    </p>
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>All of the above information provided by me has no false
+          entries. If so, I am liable of getting blacklisted.</span>
+      </label>
+    </p>
+    <p style="display: none">
+      <label>
+        <input type="checkbox" name="bot-field">
+        <span>I am a bot</span>
+      </label>
+    </p>
+    <p>
+      <strong>
+        Note: You will receive an email within 24 hrs, if any of the
+        validation checks are not passed.
+      </strong>
+    </p>
+  </div>
+  <div class="apply-flex center-content submit-btn">
+    <input class="waves-effect waves-light btn-large large-font" type="submit" value="Submit">
+  </div>
+</form>
+
+<form name="{{ gsoc_student_form_name }}" method="post"
+      netlify-honeypot="bot-field" class="participated-in-gsoc-form display-none"
+      data-netlify="true" action="/">
+  <h5 class="text-center custom-green-color-font bold-text">
+    Google Summer of Code, Participation Student Details
+  </h5>
+  {% csrf_token %}
+  {% for field in gsoc_student_form %}
+    <div class="row">
+      <div class="input-field col s12">
+        {% if field.name == 'user' %}
+        <p>{{ field.label_tag }}</p>
+        {% else %}
+        {{ field.label_tag }}
+        {% endif %}
+        {{ field }}
+        {% if field.help_text %}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ field.help_text }}</i>
+        {% endif %}
+      </div>
+    </div>
+  {% endfor %}
+  <div class="validation-checkboxes">
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>I am a member of {{ org.name }} oragnization.</span>
+      </label>
+    </p>
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>All of the above information provided by me has no false
+          entries. If so, I am liable of getting blacklisted.</span>
+      </label>
+    </p>
+    <p style="display: none">
+      <label>
+        <input type="checkbox" name="bot-field">
+        <span>I am a bot</span>
+      </label>
+    </p>
+    <p>
+      <strong>
+        Note: You will receive an email within 24 hrs, if any of the
+        validation checks are not passed.
+      </strong>
+    </p>
+  </div>
+  <div class="apply-flex center-content submit-btn">
+    <input class="waves-effect waves-light btn-large large-font" type="submit" value="Submit">
+  </div>
+</form>
+
+<form name="{{ assign_issue_form_name }}" method="post"
+      netlify-honeypot="bot-field" class="get-issue-assigned-form display-none"
+      data-netlify="true" action="/">
+  <h5 class="text-center custom-green-color-font bold-text">
+    On which Issue you want to work?
+  </h5>
+  {% csrf_token %}
+  {% for field in assign_issue_form %}
+    <div class="row">
+      <div class="input-field col s12">
+        {% if field.name == 'user' or field.name == 'hoster' %}
+        <p>{{ field.label_tag }}</p>
+        {% elif field.name != 'requested_user' %}
+        {{ field.label_tag }}
+        {% endif %}
+        {{ field }}
+        {% if field.help_text %}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ field.help_text }}</i>
+        {% endif %}
+      </div>
+    </div>
+  {% endfor %}
+  <div class="validation-checkboxes">
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>I am a member of {{ org.name }} oragnization.</span>
+      </label>
+    </p>
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>All of the above information provided by me has no false
+          entries. If so, I am liable of getting blacklisted.</span>
+      </label>
+    </p>
+    <p style="display: none">
+      <label>
+        <input type="checkbox" name="bot-field">
+        <span>I am a bot</span>
+      </label>
+    </p>
+    <p>
+      <strong>
+        Note: You will receive an email within 24 hrs, if any of the
+        validation checks are not passed.
+      </strong>
+    </p>
+  </div>
+  <div class="apply-flex center-content submit-btn">
+    <input class="waves-effect waves-light btn-large large-font" type="submit" value="Submit">
+  </div>
+</form>
+
+<form name="{{ newcomer_promotion_form_name }}" method="post"
+      netlify-honeypot="bot-field" class="newcomer-promotion-form display-none"
+      data-netlify="true" action="/">
+  <h5 class="text-center custom-green-color-font bold-text">
+    Newcomer Promotion Request Form
+  </h5>
+  {% csrf_token %}
+  <div class="form-step-div">
+    <h6 class="bold-text custom-green-color-font">User Details</h6>
+    <div class="row">
+      <div class="input-field col s12">
+        <p>{{ newcomer_promotion_form.github_username.label_tag }}</p>
+        {{ newcomer_promotion_form.github_username }}
+      </div>
+    </div>
+    <div class="row">
+      <div class="input-field col s12">
+        {{ newcomer_promotion_form.gitlab_user_id.label_tag }}
+        {{ newcomer_promotion_form.gitlab_user_id }}
+      </div>
+    </div>
+  </div>
+  <div class="form-step-div">
+    <h6 class="bold-text custom-green-color-font">Personal Project Details</h6>
+    <div class="row">
+      <div class="input-field col s12">
+        {{ newcomer_promotion_form.project_web_url.label_tag }}
+        {{ newcomer_promotion_form.project_web_url }}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ newcomer_promotion_form.project_web_url.help_text }}</i>
+      </div>
+    </div>
+    <div style="padding-left: 10px">
+      <h6 class="bold-text custom-green-color-font">Files Relative Path
+        (to project root)
+      </h6>
+      <div class="row">
+        <div class="input-field col s12">
+          {{ newcomer_promotion_form.build_file_relative_path.label_tag }}
+          {{ newcomer_promotion_form.build_file_relative_path }}
+          <i class="fa fa-info-circle" aria-hidden="true">{{ newcomer_promotion_form.build_file_relative_path.help_text }}</i>
+        </div>
+      </div>
+      <div class="row">
+        <div class="input-field col s12">
+          {{ newcomer_promotion_form.coafile_relative_path.label_tag }}
+          {{ newcomer_promotion_form.coafile_relative_path }}
+          <i class="fa fa-info-circle" aria-hidden="true">{{ newcomer_promotion_form.coafile_relative_path.help_text }}</i>
+        </div>
+      </div>
+    </div>
+    <div class="row">
+      <div class="input-field col s12">
+        {{ newcomer_promotion_form.gist_or_snippet_id.label_tag }}
+        {{ newcomer_promotion_form.gist_or_snippet_id }}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ newcomer_promotion_form.gist_or_snippet_id.help_text }}</i>
+      </div>
+    </div>
+  </div>
+  <div class="form-step-div">
+    <h6 class="bold-text custom-green-color-font">Newcomer Issue Related
+      Details</h6>
+    <div class="row">
+      <div class="input-field col s12">
+        {{ newcomer_promotion_form.newcomer_solved_issue_web_url.label_tag }}
+        {{ newcomer_promotion_form.newcomer_solved_issue_web_url }}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ newcomer_promotion_form.newcomer_solved_issue_web_url.help_text }}</i>
+      </div>
+    </div>
+    <div class="row">
+      <div class="input-field col s12">
+        {{ newcomer_promotion_form.newcomer_issue_related_pr.label_tag }}
+        {{ newcomer_promotion_form.newcomer_issue_related_pr }}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ newcomer_promotion_form.newcomer_issue_related_pr.help_text }}</i>
+      </div>
+    </div>
+    <div class="row">
+      <div class="input-field col s12">
+        {{ newcomer_promotion_form.newcomer_issue_pr_reviewed_url.label_tag }}
+        {{ newcomer_promotion_form.newcomer_issue_pr_reviewed_url }}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ newcomer_promotion_form.newcomer_issue_pr_reviewed_url.help_text }}</i>
+      </div>
+    </div>
+  </div>
+  <div class="form-step-div">
+    <h6 class="bold-text custom-green-color-font">Low Difficulty Issue
+      Related Details</h6>
+    <div class="row">
+      <div class="input-field col s12">
+        {{ newcomer_promotion_form.low_level_solved_issue_web_url.label_tag }}
+        {{ newcomer_promotion_form.low_level_solved_issue_web_url }}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ newcomer_promotion_form.low_level_solved_issue_web_url.help_text }}</i>
+      </div>
+    </div>
+    <div class="row">
+      <div class="input-field col s12">
+        {{ newcomer_promotion_form.low_level_issue_related_pr.label_tag }}
+        {{ newcomer_promotion_form.low_level_issue_related_pr }}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ newcomer_promotion_form.low_level_issue_related_pr.help_text }}</i>
+      </div>
+    </div>
+    <div class="row">
+      <div class="input-field col s12">
+        {{ newcomer_promotion_form.low_level_issue_pr_reviewed_url.label_tag }}
+        {{ newcomer_promotion_form.low_level_issue_pr_reviewed_url }}
+        <i class="fa fa-info-circle" aria-hidden="true">{{ newcomer_promotion_form.low_level_issue_pr_reviewed_url.help_text }}</i>
+      </div>
+    </div>
+    <div class="row">
+      <div class="input-field col s12">
+        {{ newcomer_promotion_form.request_created_by_user }}
+      </div>
+    </div>
+  </div>
+  <div class="validation-checkboxes">
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>I am a member of {{ org.name }} oragnization.</span>
+      </label>
+    </p>
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>I have not submitted this form for more than 3 times. If so, I
+          am liable of getting blacklisted!</span>
+      </label>
+    </p>
+    <p>
+      <label>
+        <input type="checkbox" required>
+        <span>All of the above information provided by me has no false
+          entries. If so, I am liable of getting blacklisted.</span>
+      </label>
+    </p>
+    <p style="display: none">
+      <label>
+        <input type="checkbox" name="bot-field">
+        <span>I am a bot</span>
+      </label>
+    </p>
+    <p>
+      <strong>
+        Note: You will receive an email within 24 hrs, if any of the
+        validation checks are not passed.
+      </strong>
+    </p>
+  </div>
+  <div class="apply-flex center-content submit-btn">
+    <input class="waves-effect waves-light btn-large large-font" type="submit" value="Submit">
+  </div>
+</form>
diff --git a/templates/contributors.html b/templates/contributors.html
index 32abe1a6..3f6217bf 100644
--- a/templates/contributors.html
+++ b/templates/contributors.html
@@ -1,40 +1,161 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <!-- Required meta tags -->
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <!-- Bootstrap CSS -->
-    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
-    <title>Contributors Data</title>
-  </head>
-  <body>
-    <h1>Details of all the contributors</h1>
-    <ul>
-      {% for contributor in contributors %}
-      <div class="container">
-        <div class="row">
-          <div class="col-sm-6 col-md-4">
-            <div class="thumbnail">
-              <div class="caption">
-                <p>login: {{ contributor.login }}</p>
-                <p>name: {{ contributor.name }}</p>
-                <p>bio: {{ contributor.bio }}</p>
-                <p>num_commits: {{ contributor.num_commits }}</p>
-                <p>reviews: {{ contributor.reviews }}</p>
-                <p>issues_opened: {{ contributor.issues_opened }}</p>
-                <p>teams:
-                {% for team in contributor.teams.all %}
-                    {{ team.name }}
-                {% endfor %}{# for team in contributor.teams.all #}
-                </p>
-              </div>
-            </div>
-          </div>
+{% extends 'base.html' %}
+{% load staticfiles %}
+{% block title %}
+  Community | Contributors
+{% endblock %}
+
+{% block add_css_files %}
+  <link rel="stylesheet" href="{% static 'css/contributors.css' %}">
+{% endblock %}
+
+{% block add_js_files %}
+  <script src="//cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.js"></script>
+  <script src="{% static 'js/contributors.js' %}"></script>
+  <script src="{% static 'js/contributor_statistics.js' %}"></script>
+{% endblock %}
+
+{% block main-content %}
+
+  <div class="web-page-details apply-flex center-content">
+    <h3 style="padding-right: 15px">~</h3>
+    <h3 class="page-name">
+      Our Precious Contributors
+    </h3>
+    <h3 style="padding-left: 15px">~</h3>
+  </div>
+
+  <div class="apply-flex center-content">
+    <p class="container web-page-description">
+      Contributor's who've been putting their hard-work to make {{ org.name }} best of its
+      own. Thanks to all contributors to make {{ org.name }} what is it today.
+    </p>
+  </div>
+
+  <div class="contributors-section apply-flex center-content">
+    <div class="form-fields">
+      <form>
+        <div class="input-field apply-flex center-content search-field">
+          <i class="fa fa-search social-icons"></i>
+          <input id="search" type="search" autocomplete="off" placeholder="Search by username or name" required>
+          <i class="fa fa-close social-icons"></i>
         </div>
+      </form>
+    <div class="apply-flex center-content">
+    </div>
+      <div class="search-results">
+        <table>
+          <thead>
+            <tr>
+              <th>Search Results</th>
+            </tr>
+          </thead>
+          <tbody class="search-results-tbody large-font">
+            <tr>
+              <td>
+                No results found!
+              </td>
+            </tr>
+          </tbody>
+        </table>
       </div>
-      <hr>
-      {% endfor %}{# for contributor in contributors #}
-    </ul>
-  </body>
-</html>
+    </div>
+  </div>
+
+  <div class="contributors-cards">
+  {% for contributor in contributors %}
+  <div class="contributor-card" login="{{ contributor.login }}" name="{{ contributor.name }}">
+    <div class="contributor-image">
+      {% if contributor.statistics %}
+      <div class="user-statistics-option" username="{{ contributor.login }}">
+        <strong>s</strong>
+      </div>
+      {% endif %}{# if contributor.statistics #}
+      <img src="//github.com/{{ contributor.login }}.png/?size=210">
+    </div>
+    <div class="contributor-details">
+      <a class="bold-text large-font" href="//github.com/{{ contributor.login }}" target="_blank">
+        {% if contributor.name %}
+        {{ contributor.name }}
+        {% else %}
+        {{ contributor.login }}
+        {% endif %}{# if contributor.name #}
+      </a>
+      <div class="apply-flex evenly-spread-content contributions gray-font-color">
+        <div class="commits">
+          <p>{{ contributor.num_commits }}</p>
+          <p class="bold-text">Commits</p>
+        </div>
+        <div class="reviews">
+          <p>{{ contributor.reviews }}</p>
+          <p class="bold-text">Reviews</p>
+        </div>
+        <div class="issues-opened">
+          <p>{{ contributor.issues_opened }}</p>
+          <p class="bold-text">Issues</p>
+        </div>
+      </div>
+    </div>
+  </div>
+  {% endfor %}{# for contributor in contributors #}
+  </div>
+
+  <div class="user-statistics">
+    <div class="close-statistics apply-flex close-form">
+      <i class="fa fa-times" aria-hidden="true"></i>
+    </div>
+    <div class="input-field row">
+      <div class="col s6 m3 l2">
+        <select id="hoster-selector">
+          <option value="github">GitHub</option>
+          <option value="gitlab">GitLab</option>
+        </select>
+      </div>
+      <div class="col s6 m3 l2">
+        <select id="stats-divider">
+          <option value="yearly">Yearly</option>
+          <option value="monthly">Last 12 Months</option>
+          <option value="weekly">Last 12 weeks</option>
+        </select>
+      </div>
+    </div>
+    <div class="statistics-graphs apply-flex">
+      <div class="stats-canvas bar-issues-canvas">
+        <canvas id="issues-canvas"></canvas>
+      </div>
+      <div class="stats-canvas bar-commits-canvas">
+        <canvas id="commits-canvas"></canvas>
+      </div>
+      <div class="stats-canvas bar-reviews-canvas">
+        <canvas id="reviews-canvas"></canvas>
+      </div>
+      <div class="stats-canvas line-merge-requests-canvas">
+        <canvas id="merge-requests-canvas"></canvas>
+      </div>
+    </div>
+    <div class="repository-canvas">
+      <canvas id="repository-stats-canvas"></canvas>
+    </div>
+    <div class="some-important-information">
+      <div class="worked-on-issues">
+        <h6><strong>Types of issues user worked on-</strong></h6>
+        <div class="issues-labels">
+          <h6>GitHub:</h6>
+          <div class="github-issue-labels apply-flex center-content"></div>
+          <h6>GitLab:</h6>
+          <div class="gitlab-issue-labels apply-flex center-content"></div>
+        </div>
+      </div>
+      <div class="working-on-issues-count">
+        <h6><strong>Working on issues count-</strong></h6>
+        <div class="issues-count">
+          <ol class="count-list"></ol>
+        </div>
+      </div>
+      <div class="data-updated-at">
+        <h6><strong>User lasted updated on-</strong></h6>
+        <div class="user-updated-datetime apply-flex"></div>
+      </div>
+    </div>
+  </div>
+
+{% endblock %}
diff --git a/templates/gamification.html b/templates/gamification.html
index 48becb65..eec292fa 100644
--- a/templates/gamification.html
+++ b/templates/gamification.html
@@ -1,50 +1,146 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <!-- Required meta tags -->
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <!-- Bootstrap CSS -->
-    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
-    <title>Newcomers Data</title>
-  </head>
-  <body>
-    <h1>The gamification leaderboard</h1>
-    <p>Note: All the datetime is in UTC</p>
-    <hr>
-    <ul>
-      {% for participant in participants %}
-      <div class="container">
-        <div class="row">
-          <div class="col-sm-6 col-md-4">
-            <div class="thumbnail">
-              <div class="caption">
-                <p>Username: {{ participant.username }}</p>
-                <p><a href="//github.com/{{ participant.username }}">
-                GitHub Profile</a></p>
-                <p><a href="//gitlab.com/{{ participant.username }}">
-                GitLab Profile</a></p>
-                <p><a href="//www.openhub.net/accounts/{{ participant.username }}">OpenHub Profile</a></p>
-                <p>Score: {{ participant.score }}</p>
-                <p>Level: {{ participant.level.name }}</p>
-                <p>Activities Performed:
-                {% for activity in participant.activities.all %}
-                  <p>{{ forloop.counter }}. {{ activity.name }}, performed_at:
-                    {{ activity.performed_at }} updated_at: {{ activity.updated_at }}
-                  </p>
-                  {% endfor %}{# for activity in participant.activities.all #}
-                <p>Badges Earned:
-                {% for badge in participant.badges.all %}
-                  <p>{{ forloop.counter }}.{{ badge.name }}</p>
-                  {% endfor %}{# for badge in participant.badges.all #}
-                </p>
+{% extends 'base.html' %}
+{% load staticfiles %}
+{% block title %}
+  Community | Gamification Leaderboard
+{% endblock %}
+
+{% block add_css_files %}
+  <link rel="stylesheet" href="{% static 'css/contributors.css' %}">
+  <link rel="stylesheet" href="{% static 'css/meta-reviewers.css' %}">
+  <link rel="stylesheet" href="{% static 'css/gamification.css' %}">
+{% endblock %}
+
+{% block add_js_files %}
+  <script src="{% static 'js/contributors.js' %}"></script>
+{% endblock %}
+
+{% block main-content %}
+
+  <div class="web-page-details apply-flex center-content">
+    <h3 style="padding-right: 15px">~</h3>
+    <h3 class="page-name">
+      Contributors Gamification Leaderboard
+    </h3>
+    <h3 style="padding-left: 15px">~</h3>
+  </div>
+
+  <div class="apply-flex center-content">
+    <p class="container web-page-description">
+      The leaderboard is based upon the gamification system which automates the
+      recognition of activities performed by community contributors. Based on activities
+      performed, various parameters are calculated.
+    </p>
+  </div>
+
+  <div class="contributors-section apply-flex center-content">
+    <div class="form-fields">
+      <form>
+        <div class="input-field apply-flex center-content search-field">
+          <i class="fa fa-search social-icons"></i>
+          <input id="search" type="search" autocomplete="off" placeholder="Search by username or name" required>
+          <i class="fa fa-close social-icons"></i>
+        </div>
+      </form>
+      <div class="search-results">
+        <table>
+          <thead>
+            <tr>
+              <th>Search Results</th>
+            </tr>
+          </thead>
+          <tbody class="search-results-tbody large-font">
+            <tr>
+              <td>
+                No results found!
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </div>
+
+  <div class="contributors-cards column-flex">
+  {% for contributor in gamification_results %}
+    <div class="contributor-card meta-reviewer gamifier-card apply-flex" login="{{ contributor.username }}">
+      <div class="contributor-image meta-reviewer-image gamifier-image">
+        <img src="//github.com/{{ contributor.username }}.png/?size=400"
+             alt="user-image">
+        <div class="bottom-center large-font bold-text social-links">
+          <a href="//github.com/{{ contributor.username }}" target="_blank">
+            <i class="fa fa-github github-icon social-icons" aria-hidden="true"></i>
+          </a>
+          <a href="//gitlab.com/{{ contributor.username }}" target="_blank">
+            <i class="fa fa-gitlab social-icons gitlab-icon" aria-hidden="true"></i>
+          </a>
+          <a href="//www.openhub.net/accounts/{{ contributor.username }}" target="_blank" class="social-icons">OH</a>
+        </div>
+      </div>
+      <div class="gamifier-details">
+        <div class="gamifier-details-part-1 column-flex">
+          <div class="column-flex large-font gray-font-color">
+            <span>
+              <b>Username:</b>
+              {{ contributor.username }}
+            </span>
+            <span>
+              <b>Score:</b>
+              {{ contributor.score }}
+            </span>
+            <span>
+              <b>Level:</b>
+              {{ contributor.level.name }}
+            </span>
+            <div>
+              {% if contributor.badges.all %}
+              <b>Badges Earned:</b>
+              <div class="column-flex">
+              {% for badge in contributor.badges.all %}
+                <span>
+                  <b>-></b>
+                  {{ badge.name }}
+                </span>
+              {% endfor %}{# for badge in contributor.badges.all #}
               </div>
+              {% else %}{# if contributor.badges.all #}
+              <span>
+                <b>No badges earned!<i class="fa fa-frown-o"></i></b>
+              </span>
+              {% endif %}{# if contributor.badges.all #}
+            </div>
+            <div class="column-flex">
+              <b>Some Activities permormed:</b>
+              {% for activity in contributor.activities.all|slice:":2" %}
+              <span>
+                <b>{{ forloop.counter }}.</b> {{ activity.name }}, on {{ activity.performed_at }}
+              </span>
+              {% endfor %}{# for activity in contributor.activities.all|slice:":2" #}
             </div>
           </div>
         </div>
+
+        {% if contributor.activities.all|slice:"2:6" %}
+        <div class="gamifier-details-part-2 column-flex large-font gray-font-color">
+          {% for activity in contributor.activities.all|slice:"2:6" %}
+          <span>
+            <b>{{ forloop.counter|add:2 }}.</b> {{ activity.name }}, on {{ activity.performed_at }}
+          </span>
+          {% endfor %}{# for activity in contributor.activities.all|slice:"2:6" #}
+        </div>
+        {% endif %}{# if contributor.activities.all|slice:"2:6" #}
+
+        {% if contributor.activities.all|slice:"6:10" %}
+        <div class="gamifier-details-part-3 column-flex large-font gray-font-color">
+          {% for activity in contributor.activities.all|slice:"6:10" %}
+          <span>
+            <b>{{ forloop.counter|add:6 }}.</b> {{ activity.name }}, on: {{ activity.performed_at }}
+          </span>
+          {% endfor %}{# for activity in contributor.activities.all|slice:"6:10" #}
+        </div>
+        {% endif %}{# if contributor.activities.all|slice:"6:10" #}
       </div>
-      <hr>
-      {% endfor %}{# for participant in participants #}
-    </ul>
-  </body>
-</html>
+    </div>
+    {% endfor %}{# for contributor in gamification_results #}
+  </div>
+
+{% endblock %}
diff --git a/templates/gci_students.html b/templates/gci_students.html
new file mode 100644
index 00000000..8c969fd7
--- /dev/null
+++ b/templates/gci_students.html
@@ -0,0 +1,86 @@
+{% extends 'base.html' %}
+{% load staticfiles %}
+{% block title %}
+  Community | GCI Students
+{% endblock %}
+
+{% block add_css_files %}
+<link rel="stylesheet" href="{% static 'css/gci_students.css' %}">
+{% endblock %}
+
+{% block add_js_files %}
+<script src="{% static 'js/timeago.js' %}"></script>
+{% endblock %}
+
+{% block main-content %}
+  <div class="web-page-details apply-flex center-content">
+    <h3 style="padding-right: 15px">~</h3>
+    <h3 class="page-name">
+      <img src="{{ org.logo_url }}" alt="{{ org.name }}">
+      GCI Students
+    </h3>
+    <h3 style="padding-left: 15px">~</h3>
+  </div>
+
+  <div class="apply-flex-center">
+    <p class="container web-page-description">
+      Hello, World! {{ org.name }} has been participating in GCI (Google Code-In) from last few years and will
+      be participating in coming years too. Following are the GCI students who  participated in GCI with {{ org.name }}
+      organization.
+    </p>
+  </div>
+
+  {% if gci_students.data %}
+  <div class="gci-students apply-flex evenly-spread-content custom-green-color-font">
+  {% for student in gci_students.data %}
+    <div class="student-card card horizontal">
+      <div class="student-image card-image apply-flex">
+        <img src="//github.com/{{ student.username }}.png/">
+      </div>
+      <div class="student-details card-content">
+        <a class="user-name bold-text" href="//github.com/{{ student.username }}" target="_blank">
+          {% if student.display_name %}
+            {{ student.display_name }}
+          {% else %}
+            {{ student.username }}
+          {% endif %}
+        </a><br>
+        {% if student.bio %}
+          <p>{{ student.bio }}</p>
+        {% endif %}{# if student.bio #}
+        <div class="inline-contents">
+          <p class="gci-student-id">ID:</p>
+          <a href="{{ student.url }}" target="_blank"> {{ student.id }}</a>
+        </div><br>
+        <div class="inline-contents">
+          <p class="participated-year">Participation year: {{ student.program_year }}</p>
+        </div><br>
+        <div class="inline-contents">
+          <p class="public-repos">Repos:</p>
+          <p> {{ student.public_repos }}</p>
+        </div>
+        <div class="inline-contents">
+          <p class="public-gists">Gists:</p>
+          <p> {{ student.public_gists }}</p>
+        </div>
+        <div class="inline-contents">
+          <p class="followers">Followers:</p>
+          <p> {{ student.followers }}</p>
+        </div><br>
+      </div>
+    </div>
+  {% endfor %}
+  </div>
+  {% else %}
+  <div class="apply-flex center-content data-fetch-error">
+    <h5><b>ERROR:</b></h5>
+    <h5>{{ gci_students.error }}</h5>
+  </div>
+  {% endif %}{# if gci_students.data #}
+
+  <div class="apply-flex center-content data-updated-time">
+    <b>GCI Students data was updated:</b>
+    <p id="time" data-time="{{ updated_time }}"></p>
+  </div>
+
+{% endblock %}
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index 80530eeb..01ab3414 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,29 +1,118 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <title>Community website</title>
-  </head>
-  <body>
-    <img src="static/org_logo.png" alt="org logo" height="42" width="42">
-    <ul>
-      <li><a href="gci/">Google Code-in</a>
-      <li><a href="activity/">GitHub activity</a>
-      <li><a href="twitter/">Twitter Feed</a>
-      <li><a href="info.txt">Build info</a>
-      <li><a href="log/">Logs</a>
-      <li><a href="contributors/">Contributors data</a>
-      <li><a href="meta-review/">Meta-review data</a>
-      <li><a href="gamification/">Gamification leaderboard</a>
-      <li><a title="List of all the issues on organization's main repository on which assignee has not shown any activity for more than 2 months."
-        href="static/inactive-issues.json">Inactive Issues</a>
-      <li><a href="openhub/">OpenHub Data</a>
-      <li><a href="model/">Visit imported data</a>
-      <li><a title="List of all the issues on organization main repository on which someone has opened a pull request without getting assigned to it."
-        href="static/unassigned-issues.json">Unassigned issues activity</a>
-    </ul>
-    {% if isTravis %}
-    <small>This website was built automatically using Travis CI. A link to the build can be found <a href="{{ travisLink }}">here</a>.</small>
-    {% endif %}{# if isTravis #}
-  </body>
-</html>
+{% extends 'base.html' %}
+{% load staticfiles %}
+{% block title %}
+  Community | Homepage
+{% endblock %}
+
+{% block add_css_files %}
+<link rel="stylesheet" href="{% static 'css/index.css' %}">
+{% endblock %}
+
+{% block add_js_files %}
+<script src="//cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.bundle.js"></script>
+<script src="{% static 'js/index.js' %}"></script>
+{% endblock %}
+
+{% block main-content %}
+
+  <div class="community-header-image">
+    <img src="{% static 'images/os_community_header.jpg' %}" alt="OpenSource Community">
+  </div>
+
+  <div class="center about-org custom-green-color-font" id="about" style="margin-top: -2%">
+    <div class="center">
+      <h3>Welcome to {{ org.name }}</h3>
+      <p style="margin: 0 10%; color: black">{{ org.about }}</p>
+    </div>
+  </div>
+  {% if quote_details %}
+  <div class="center quote-of-day custom-green-color-font">
+    <div class="center apply-flex center-content">
+      <h3 style="padding-right: 15px">~</h3>
+      <div class="quote">
+        <p style="margin-bottom: 0">{{ quote_details.quote }}</p>
+        <h6 style="margin-top: 0">- {{ quote_details.author }}</h6>
+      </div>
+      <h3 style="padding-left: 15px">~</h3>
+    </div>
+  </div>
+  {% endif %}{# if quote_details #}
+
+  <div class="center org-teams-stats apply-flex evenly-spread-content custom-green-color-font">
+    {% for team_name, members_count in org.team_details.items %}
+    <div class="team" style="margin-right: 20px">
+      <h3 style="margin-bottom: 0">{{ members_count }}</h3>
+      <h4 style="margin-top: 0">{{ team_name }}</h4>
+    </div>
+    {% endfor %}{# for team_name, members_count in org.team_details.items #}
+  </div>
+
+  <div class="organization-map">
+    {% include 'map.html' %}
+  </div>
+
+  <div class="top-contributors">
+    <div class="top-meta-reviewers">
+      <table class="highlight centered">
+        <thead class="custom-green-color-font">
+          <tr>
+            <th>Rank</th>
+            <th>Username</th>
+            <th>Meta-review Score</th>
+          </tr>
+        </thead>
+        <tbody>
+        {% for contrib in top_meta_review_users %}
+          <tr class="clickable-row" data-href="/meta-review/#{{ contrib.login }}">
+            <td>{{ contrib.rank }}</td>
+            <td>{{ contrib.login }}</td>
+            <td>{{ contrib.score|floatformat:0 }}</td>
+          </tr>
+        {% endfor %}{# for contrib in top_meta_review_users #}
+        </tbody>
+      </table>
+      <a href="{% url 'meta_review_data' %}" class="waves-effect waves-light btn leaderboards-btn">Contributors Meta-review</a>
+    </div>
+    <div class="top-gamifiers">
+      <table class="highlight centered">
+        <thead class="custom-green-color-font">
+          <tr>
+            <th>Rank</th>
+            <th>Username</th>
+            <th>Gamification Score</th>
+          </tr>
+        </thead>
+        <tbody>
+        {% for index, contrib in top_gamification_users %}
+          <tr class="clickable-row" data-href="/gamification/#{{ contrib.username }}">
+            <td>{{ index|add:"1" }}</td>
+            <td>{{ contrib.username }}</td>
+            <td>{{ contrib.score }}</td>
+          </tr>
+        {% endfor %}{# for index, contrib in top_gamification_users #}
+        </tbody>
+      </table>
+      <a href="{% url 'community-gamification' %}" class="waves-effect waves-light btn leaderboards-btn">Gamification leaderboard</a>
+    </div>
+  </div>
+
+  <div class="join-btn apply-flex center-content">
+    <a href="{% url 'join-community' %}" id="join" class="waves-effect waves-light btn-large">
+      <b>Want to join {{ org.name }}?</b>
+    </a>
+  </div>
+
+  <div class="activity-graph">
+    <div class="activity-graph-canvas">
+      <canvas id="canvas"></canvas>
+    </div>
+    <div class="input-field">
+      <select id="chart-type">
+        <option value="Month">Year</option>
+        <option value="Week">Month</option>
+        <option value="Day">Week</option>
+      </select>
+    </div>
+  </div>
+
+{% endblock %}
diff --git a/templates/join_community.html b/templates/join_community.html
new file mode 100644
index 00000000..72f43830
--- /dev/null
+++ b/templates/join_community.html
@@ -0,0 +1,76 @@
+{% extends 'base.html' %}
+{% load staticfiles %}
+
+{% block add_css_files %}
+  <link rel="stylesheet" href="{% static 'css/join-community.css' %}">
+{% endblock %}
+
+{% block add_js_files %}
+{% endblock %}
+
+{% block main-content %}
+  <div class="web-page-details apply-flex center-content">
+    <h3 style="padding-right: 15px">~</h3>
+    <div class="page-name">
+      <h3>Join Community</h3>
+    </div>
+    <h3 style="padding-left: 15px">~</h3>
+  </div>
+  <div class="apply-flex center-content">
+    <form name="{{ join_community_form_name }}" method="post" netlify-honeypot="bot-field"
+        class="join-community-form" data-netlify="true" action="/?form_submitted=True">
+    {% csrf_token %}
+    {% for field in join_community_form %}
+      <div class="row">
+        <div class="input-field col s12">
+          <p>
+            {{ field.label_tag }}
+          </p>
+          {{ field }}
+        </div>
+      </div>
+    {% endfor %}
+    <div class="validation-checkboxes">
+      <p>
+        <label>
+          <input type="checkbox" required>
+          <span>
+            I have requested access to
+            <a href="{{ gitlab_newcomers_group_url }}" class="bold-text">
+              {{ org.name }} Newcomers Group
+            </a>
+            on GitLab
+          </span>
+        </label>
+      </p>
+      <p>
+        <label>
+          <input type="checkbox" required>
+          <span>I have not created my GitHub or GitLab account in the last 60 minutes.</span>
+        </label>
+      </p>
+      <p>
+        <label>
+          <input type="checkbox" required>
+          <span>All of the above information provided by me has no false entries. If so, I am liable
+            of getting blacklisted.</span>
+        </label>
+      </p>
+      <p style="display: none">
+        <label>
+          <input type="checkbox" name="bot-field">
+          <span>I am a bot</span>
+        </label>
+      </p>
+      <p>
+        <strong>
+          Note: You will receive an invite email within 24 hrs, if all the validation checks are passed.
+        </strong>
+      </p>
+    </div>
+    <div class="apply-flex center-content submit-btn">
+      <input class="waves-effect waves-light btn-large large-font" type="submit" value="Submit">
+    </div>
+    </form>
+  </div>
+{% endblock %}
diff --git a/templates/map.html b/templates/map.html
new file mode 100644
index 00000000..60fcb77f
--- /dev/null
+++ b/templates/map.html
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+{% load staticfiles %}
+{# This is an auto-generated file, which is modified to support django-template syntax. #}
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>Leaflet debug page</title>
+    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-beta.2/leaflet.css">
+    <script src="//cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-beta.2/leaflet.js"></script>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    {# Below stylesheets and scripts are being generated by `getorg`. Run #}
+    {#  build command to get these files #}
+    <link rel="stylesheet" href="{% static 'leaflet_dist/screen.css' %}">
+    <link rel="stylesheet" href="{% static 'leaflet_dist/MarkerCluster.css' %}">
+    <link rel="stylesheet" href="{% static 'leaflet_dist/MarkerCluster.Default.css' %}">
+    <script src="{% static 'leaflet_dist/leaflet.markercluster-src.js' %}"></script>
+    <script src="{% static 'org-locations.js' %}"></script>
+
+    <style>
+      #map {
+        width: 60%;
+        height: 300px;
+        margin: auto;
+        box-shadow: 0 0 25px 2px;
+      }
+      @media only screen and (max-width:750px){
+        #map {
+          width: 90%;
+        }
+      }
+    </style>
+
+  </head>
+  <body>
+    <div id="map"></div>
+    <script>
+      var tiles = L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}',
+        {
+          maxZoom: 18,
+          attribution: 'Tiles &copy; Esri &mdash; Source: Esri, DeLorme, NAVTEQ, USGS, Intermap, iPC, NRCAN, Esri Japan, METI, Esri China (Hong Kong), Esri (Thailand), TomTom, 2012'
+        }),
+      latlng = L.latLng(30, 10);
+      var map = L.map('map', {center: latlng, zoom: 0.7, layers: [tiles]});
+      var markers = L.markerClusterGroup({
+        showCoverageOnHover: false,
+        maxClusterRadius: 80
+      });
+      for (var i = 0; i < addressPoints.length; i++) {
+        var a = addressPoints[i];
+        var title = a[0];
+        var marker = L.marker(new L.LatLng(a[1], a[2]), { title: title });
+        marker.bindPopup(title);
+        markers.addLayer(marker);
+      }
+      map.addLayer(markers);
+      map.zoomIn();
+    </script>
+  </body>
+</html>
diff --git a/templates/meta_review.html b/templates/meta_review.html
index a6215de4..956c9935 100644
--- a/templates/meta_review.html
+++ b/templates/meta_review.html
@@ -1,53 +1,145 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <!-- Required meta tags -->
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <!-- Bootstrap CSS -->
-    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
-    <title>Meta-review Score Ranking List</title>
-  </head>
-  <body>
-    <h1>Details of meta-review score</h1>
-    <ul>
-      {% for participant in participants %}
-      <div class="container">
-        <div class="row">
-          <div class="col-sm-6 col-md-4">
-            <div class="thumbnail">
-              <div class="caption">
-                <p>login: {{ participant.login }}</p>
-                <p>name: {{ participant.name }}</p>
-                <p>score: {{ participant.score|floatformat:2 }}</p>
-                <p>rank: {{ participant.rank }}</p>
-                <p>trend: {{ participant.trend }}</p>
-                <p>received: </p>
-                <p>number of positive reactions: {{ participant.pos_in }}</p>
-                <p>
-                  weighted positive reactions:
-                  {{ participant.weighted_pos_in|floatformat:2 }}
-                </p>
-                <p>number of negative reactions: {{ participant.neg_in }}</p>
-                <p>
-                  weighted negative reactions:
-                  {{ participant.weighted_neg_in|floatformat:2 }}
-                </p>
-                <p>give away: </p>
-                <p>number of positive reactions: {{ participant.pos_out }}</p>
-                <p>number of negative reactions: {{ participant.neg_out }}</p>
-                <p>
-                  negative point offset:
-                  {{ participant.offset|floatformat:2 }}
-                </p>
-                <p>weight_factor: {{ participant.weight_factor|floatformat:2 }}</p>
-              </div>
+{% extends 'base.html' %}
+{% load staticfiles %}
+{% block title %}
+  Community | Meta-Review
+{% endblock %}
+
+{% block add_css_files %}
+  <link rel="stylesheet" href="{% static 'css/contributors.css' %}">
+  <link rel="stylesheet" href="{% static 'css/meta-reviewers.css' %}">
+{% endblock %}
+
+{% block add_js_files %}
+  <script src="{% static 'js/contributors.js' %}"></script>
+{% endblock %}
+
+{% block main-content %}
+
+  <div class="web-page-details apply-flex center-content">
+    <h3 style="padding-right: 15px">~</h3>
+    <h3 class="page-name">
+      Contributors Meta-Review Details
+    </h3>
+    <h3 style="padding-left: 15px">~</h3>
+  </div>
+
+  <div class="apply-flex center-content">
+    <p class="container web-page-description">
+      Contributor meta-review related details are calculated based upon the
+      GitHub reactions made by that contributor on any issue or merge request
+      within an organization, for example - {{ org.name }}.
+    </p>
+  </div>
+
+  <div class="contributors-section apply-flex center-content">
+    <div class="form-fields">
+      <form>
+        <div class="input-field apply-flex center-content search-field">
+          <i class="fa fa-search social-icons"></i>
+          <input id="search" type="search" autocomplete="off" placeholder="Search by username or name" required>
+          <i class="fa fa-close social-icons"></i>
+        </div>
+      </form>
+    <div class="apply-flex center-content">
+    </div>
+      <div class="search-results">
+        <table>
+          <thead>
+            <tr>
+              <th>Search Results</th>
+            </tr>
+          </thead>
+          <tbody class="search-results-tbody large-font">
+            <tr>
+              <td>
+                No results found!
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </div>
+
+  <div class="contributors-cards">
+  {% for contributor in contributors_meta_review_details %}
+  <div class="contributor-card meta-reviewer apply-flex" login="{{ contributor.login }}" name="{{ contributor.name }}">
+    <div class="contributor-image meta-reviewer-image">
+      <img src="//github.com/{{ contributor.login }}.png/?size=210"
+           alt="user-image">
+      <div class="top-right large-font bold-text">
+        {{ contributor.rank }}
+      </div>
+    </div>
+    <div class="metareviewer-details">
+      <div class="contributor-details-part-1 column-flex">
+        <a class="bold-text large-font" href="//github.com
+        /{{ contributor.login }}" target="_blank">
+          {% if contributor.name %}
+          {{ contributor.login }} ({{ contributor.name }})
+          {% else %}
+          {{ contributor.login }}
+          {% endif %}{# if contributor.name #}
+        </a>
+        <div class="large-font gray-font-color">
+          <span>
+            <b>Score:</b>
+            {{ contributor.score|floatformat:2 }}
+          </span>
+          <span>
+            <b>Trend:</b>
+            {{ contributor.trend }}
+          </span>
+          <div>
+            <b>Given reactions:</b>
+            <div>
+              <span>
+                <i class="fa fa-smile-o"></i>
+                {{ contributor.pos_out }}
+                <i class="fa fa-frown-o"></i>
+                {{ contributor.neg_out }}
+              </span>
             </div>
           </div>
+          <span>
+            <b>Weight factor:</b>
+            {{ contributor.weight_factor|floatformat:2 }}
+          </span>
+        </div>
+      </div>
+      <div class="contributor-details-part-2 column-flex large-font gray-font-color">
+      <div class="received-reactions">
+        <b>Received reactions:</b>
+        <div>
+          <b>> Count</b>
+          <div>
+            <span>
+              <i class="fa fa-smile-o"></i>
+              {{ contributor.pos_in }}
+              <i class="fa fa-frown-o"></i>
+              {{ contributor.neg_in }}
+            </span>
+          </div>
+        </div>
+        <div>
+          <b>> Weighted</b>
+          <div>
+            <span>
+              <i class="fa fa-smile-o"></i>
+              {{ contributor.weighted_pos_in|floatformat:0 }}
+              <i class="fa fa-frown-o"></i>
+              {{ contributor.weighted_neg_in|floatformat:0 }}
+            </span>
+          </div>
         </div>
       </div>
-      <hr>
-      {% endfor %}{# for participant in participants #}
-    </ul>
-  </body>
-</html>
+      <span>
+        <b>Negative point offset:</b>
+        {{ contributor.offset|floatformat:2 }}
+      </span>
+    </div>
+    </div>
+  </div>
+  {% endfor %}{# for contributor in contributors_meta_review_details #}
+  </div>
+{% endblock %}
diff --git a/test-requirements.txt b/test-requirements.txt
index 80fe8c3e..4b444785 100644
--- a/test-requirements.txt
+++ b/test-requirements.txt
@@ -10,7 +10,7 @@ coverage==4.4.1
 coverage-env-plugin~=0.1
 coverage-config-reload-plugin~=0.2
 codecov~=2.0.5
-moban~=0.3.3 ; python_version > '3.0'
+moban~=0.5.0 ; python_version > '3.0'
 packaging~=16.8
 pytest~=3.6.4
 pytest-cov~=2.4
@@ -27,6 +27,7 @@ pytest-travis-fold~=1.3.0
 requests-mock~=1.2
 ipdb~=0.11
 pip<10
+six>=1.11.0
 wheel~=0.29
 git+https://github.com/coala/coala.git
 git+https://github.com/coala/coala-bears.git
diff --git a/twitter/view_twitter.py b/twitter/view_twitter.py
deleted file mode 100644
index d6e54ff4..00000000
--- a/twitter/view_twitter.py
+++ /dev/null
@@ -1,34 +0,0 @@
-from django.http import HttpResponse
-import requests
-import json
-import logging
-
-from community.git import get_org_name
-
-
-def index(request):
-    logger = logging.getLogger(__name__)
-    logger.info('this package is alive')
-    s = []
-
-    org_twitter_handle = org_name = get_org_name()
-
-    s.append('<link rel="shortcut icon" type="image/png" '
-             'href="../static/favicon.png"/>')
-
-    api_data_dump = json.loads(
-        requests.get('https://gci-leaders.netlify.com/data.json').content)
-    for item in api_data_dump:
-        if item['name'] == org_name:
-            org_twitter_handle = item['twitter_url'].split(
-                'twitter.com/')[-1]
-    if org_twitter_handle is not None:
-        s.append('<a class="twitter-timeline" data-height="1000" '
-                 'data-link-color="#2B7BB9" '
-                 'href="https://twitter.com/{twitter_handle}">'
-                 'Tweets by {twitter_handle}</a> <script async '
-                 'src="https://platform.twitter.com/widgets.js" '
-                 'charset="utf-8"></script>'.format(
-                     twitter_handle=org_twitter_handle))
-
-    return HttpResponse('\n'.join(s))