Code Monkey home page Code Monkey logo

udabuddy's Introduction

To make a web app for Udacity Alumni interaction.

Workflow

Please reference this picture to understand the flow of the app.

These are the main sections of the WebApp.

Landing Page -- Contains info that you can check without login

- Signup/Login Firebase Buttons    
- About Us     : Giving details about the WebAPP Udabuddy, for reference see twitter about page
- Wall of fame : A page displaying works of Alumni or people at Udacity, Like Sebastian Thrun(only a demo page here)
- Blog Page    : A blog page by Udabuddy users with posts about their amazing work in any field of technology(only a demo page here)

Please note that both the blog page and the wall of fame page here will have all there links redirected to the intermidiate signup/signin page.

Dashboard -- Accessible once you are logged in

Job Feed  : Job feed will have posts related to job openings particular to your interests.
Menu items: This segment contains buttons that control the beahviour of how the dashboard is rendered.
Community updates: This will be a continuous feed that updates every time there is a post in the community activity.
Graphs    : This provides statics about where you stand in the community and among your friends. 
  
Dashobard contains links to all other pages of the app including the showcase,the wall of fame,the forum and the blog page.

Showcase- Show your projects and your blogs to the whole world,all at one place.

Forum- Talk to the community and see what is everyone upto.

Blog- Write out your creativity and let others also know what you learnt.

About Us- Know what is Udabuddy and how it can change your lives.

Wall of Fame- See people having amazing projects which are liked most by the community.

Weekly updates- A feed for the community events and updates and what all changes were brought about in the previous week.

How to contribute

These are designated people :-
	Rahul @oreanroy Landing and About page
	Vamsi @Vamsi Manohar Wall of fame
	Avinash @littlestar642 Blog page
	Parteek @Prateek Forum page
  Pradeep @psrajput showcase page

  These are responsible mods and co-mods whom you can contact directly, in case of any issue regarding a page.
Your PR in any one of this page will be assesed by the responsibe mod and merged if it is worth it.

Color Pallete

  • #33b5e5 #33b5e5
  • #06caba #06caba
  • #f49b89 #f49b89
  • #888ec9 #888ec9
  • #59a4c4 #59a4c4

Prerequisites

You will need the following things properly installed on your computer.

  • Git
  • Node.js (node > v6.x.x) (with NPM v5.5.1)
  • Bower - npm install -g bower

Installation

  • fork this repository
  • git clone <repository-url> this repository
  • cd udabuddy
  • npm install
  • bower install

Running / Development

Deployment from master:

https://udbuddy.herokuapp.com/

Join the development:

  • Read CONTRIBUTING.md.
  • Before you start contributing, run the app on your local machine, get familiar with it and then check for bugs or more features.
  • If you find any bug or want to add a new feature you have to open a new issue.
  • If you would like to work on an existing issue, drop in a comment on the issue.

Directory Structure:

  • views: This contains all the frontend files. Write your HTML code here and save it with .hbs extension. See homepage for reference.
  • public - Contains various assets for the app.
    • css - contains CSS files.
    • js - contains Javascript files.
  • node_modules - contains all the npm packages installed locally. Dont modify here.
  • package.json - general info about the project and node packages names.
  • index.js - the entry point into the app.

Note : These features are subject to change as per the requirements.

udabuddy's People

Contributors

abhimanyu100 avatar abhishekakade avatar ajayjam97 avatar crisner avatar littlestar642 avatar mayankjh avatar mepsrajput avatar nileshsolanki avatar nsaicharan avatar oreanroy avatar pben369 avatar prateek-tewari avatar revanthgss avatar rishabhatgit avatar skywalker212 avatar souro18 avatar trivedi-vatsal avatar vamsikrishnareddybevara avatar vamsimanohar9 avatar vsuguna avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

udabuddy's Issues

Code The Dashboard

This is the chance to show your skills to design the dashboard for Udabuddy.
Here is the rough mockup :
dashboardideanew
The Menu items on left will control the content on right. For example, a menu item controlling Job Feed, will change the Job Feed according the job stream(Java,UI,DB etc) selected from Menu items. Materialize CSS is again the choice for this.
For graphs and charts,you can explore Google Charts or D3.js.
All the best,

You are limited by your own imagination.-Team Udabuddy

Mobile view issue not fixed by #141

Hey team,
I just wanted to check if you have missed to test few cases on the app before closing the issue #140.
Issue Description: The logout on mobile is not working as mentioned earlier in #140.
Steps to replicate:
1 Signin using Google in mobile and you will be taken to dashboard page.
2 Now click on the hamburger menu icon and select logout.. Nothing happens. (applicable to all pages hence check the partials and how it is getting rendered using chrome dev tool)
Please check if the repeated code mentioned in #138 is the root cause or the nav partials are ok.

I am submitting a bug report

Current behavior: The hamburger icon does not open on click

Expected behavior: The hamburger icon has to open to display menu upon click

Add Files

Add bootstrap.min.js & favicon2.ico files in the repository.

Need a GitHub icon

Need a GitHub icon with dimension 22 x 22 in png. You can upload it in media folder (which is inside public folder) and then create a pull request.

Enhance the layout of blog Page

The present left section of the page is not properly aligned. Please center the button and modify the text so that it looks good.

Present view:-
1

Desired view:-
Aligned and enhanced layout

Setup Gulp to Optimize Workflow

I would like to setup gulp on this project in order to turn on live editing and sass preprocessing on this project. Can I make the PR after setting it up?

Make a layout for the Dashboard

This is the first feature open to the collaborators after the Login/Signup page. We will be rolling out different requirements within the coming days.
Design a dashboard
This is one of the busiest page on the website. It will contain a plethora of features. Here's the list of few features, a dashboard should have :-

  1. It should show the courses completed by the user.
  2. It should be responsive. Materialize.css is the choice to make the UI beautiful.
  3. On one side, it should show a feed of ongoing activities in the community,like, courses completed or recommended by others,Post of the day etc.
  4. It will also have the feed of the jobs proposed by the Alumni of Udacity.
  5. Useful links marked by the user will also be a part of this page.
  6. Coolest feature of the dashboard is the pop up graphs populated as Carousel (See the example). These graphs will show different data from different sources like a user activeness over last week or which part of community is active and by how much.

Desired view:-
dashboard

Feel free to add new useful features.

Udabuddy Forum Basic Idea Mockup

Mockups for Udabuddy's Forum are invited. Here is one rough template.

forumideanew
In the rough template, the first image will serve like a cover pic for the forum page.
Rest of the three images are placeholder for a user's picture and the text in front of them signifies the content that a user has posted.
Feel free to add your own creativity.

Special thanks to @vattytrivedi for providing the cover pic.

404 not found.

Design a 404 not found page and through .htacces If unable to implement .htacces ping me on slack.

Anchor URL link to resources and profile is missing in navlink partials

Anchor URL link to resources and profile is missing in navlink partials hence these two header link is not working on any page..
Impacted Code: views/partials/navlinks.hbs

Old Code in navlink partial

         <li><a href="#" id="dashboard" .........>Dashboard</a></li>
         <li><a href="#" id="resources" ........> Resources</span></a></li>
          <li><a href="#" id="profile" ........>Profile</a></li>

Suggested Change in navlink partial

         <li><a href="/dashboard" id="dashboard" ........>Dashboard</a></li>
         <li><a href="/resources" id="resources" ........> Resources</span></a></li>
         <li><a href="/profile" id="profile" ........>Profile</a></li>

image

Dashboard page issue on Mobile View

Issue1: Overlapping header bar with main content
image

Issue2: Logout/ Profile/ Resources is not working on dashboard page on mobile but these links works fine on desktop
Here I have logged in on mobile but I am not getting any way to log out and I am stuck.
image

Please feel free to add your inputs and validate the issue from your side.

Sidebar

Sidebar remain open while we navigate from smaller window width to larger window width

I am submitting a bug report on the about page

Current behavior: Cannot click navbar links on the about page and the menu icon doesn't show in the mobile view

Expected behavior: Should be able to click navbar links on the about page and the menu icon has to show in the mobile view

Improvement of "NAV BAR"

screenshot 194
guys,i want to improve the nav bar look...

"Want to add a line under the nav bar..that seperates the nav bar and the content page..."

Rectify the mobile view of landing page

present view-:
1

desired view-:

  1. decrease the text-content on the page and make it a little less overwhelming
  2. the footer text should be placed in the footer not in between buttons.
  3. enable the working of the sidebar button

make the navbar to slide in on scroll

Present behavior-:
The navbar is static and also having a bottom shadow.

Desired behaviour:-
Remove the bottom shadow on no scroll and make the navbar to slide in on scroll of 10 px.
I guess we need the code for two navs and then we can toggle proper classes on scroll.

Signin Error on Udabuddy

I tried signing in with Google and Email option but it failed.
Please check below screenshot on Google Sign in attempt.
image

Content overflow in a card from blog dashboard.

Content overflow in Completed Courses card from the dashboard in blog. There's also some extra unnecessary margin below. And the card title has excessive padding, thus the overlapping of text.
I've attached the image below.

card content overflow

Add proper names and routes to the navbar

For all the pages of the app that are presently made and working, add a name and a route to that in the navbar. Please ensure that it is done in the mobile view too.

Recommend Projects

  • React photo React

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

  • Vue.js photo Vue.js

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

  • Typescript photo Typescript

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

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

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

Recommend Topics

  • javascript

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

  • web

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

  • server

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

  • Machine learning

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

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

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

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

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

  • D3 photo D3

    Data-Driven Documents codes.