Giter VIP home page Giter VIP logo

petsygram's Introduction

petsygram

petsygram is an Instagram clone made using Django.

Features

Register, Login/Logout & Reset password (email link)

Post photos to petsygram with caption and location set by user, author and time set automatically

Post image size reduced to a width of 450px with proportional height to save room on server

Image file deleted when post is deleted

Home Page showing posts of users the authenticated user follows

Post Detail Page for users, with 'Edit Post' and 'Delete Post' buttons visible for post author

jQuery/AJAX 'Like' button accesses REST API to toggle 'Like' and update like count

Post commenting: displays truncated comments on the Home Page, and full comments on Post Detail Page

Search Page with ability to search for users or hashtags used in a published post

Notification Page showing when other users have interacted with a post (likes or comments), and when other users have started following you

Profile Page for users showing profile image (with default image), number of followers, bio, website and posts, jQuery AJAX follow/unfollow button if not the authenticated user, otherwise 'Edit Profile' and 'Logout' button

Edit Profile Page to edit username, email, website, bio, and profile image

Profile image reduced to 150px x 150px to save space on the server

Direct messaging system with inbox and links to individual message threads with other users

Infinite scrolling on Home Page

Getting Started

Follow these instructions to get a copy running on your local machine for development and testing purposes

Prerequisites

Python 3.6 & git

Installing

  1. Open up Terminal, and go into the directory where you want your local copy, e.g.
cd projects
  1. Download a copy
git clone https://github.com/peterzernia/petsygram.git
  1. Install a virtual environment
pip install virtualenv
  1. Make a folder for your virtual environments e.g.
mkdir ~/venvs
  1. Make a new virtual environment for this project
virtualenv --system-site-packages ~/venvs/petsygram
  1. Start the virtual environment
source ~/venvs/petsygram/bin/activate
  1. Generate a secret key for your django app using
python

then

from django.utils.crypto import get_random_string

then

chars = 'abcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*(-_=+)'

then

get_random_string(50, chars)

and lastly

quit()
  1. Copy this result and in your petsygram/petsygram/setting.py file replace
SECRET_KEY = os.environ.get('PETSYGRAM')

with

SECRET_KEY = 'your newly generated secret key here'
  1. Go into the directory containing 'requirements.txt'
cd petsygram
  1. Install the Python requirements
pip install -r requirements.txt
  1. Make migrations to set up the database
python manage.py makemigrations
  1. When this has completed, run these migrations
python manage.py migrate
  1. Create a user profile to login with
python manage.py createsuperuser
  1. Once you have followed the instructions to create a user, run the server
python manage.py runserver
  1. If there were no errors anywhere, you can now go to http://localhost:8000/ in your browser to view a local copy of petsygram

What I learned

Petsygram was both my first big Django project, as well as my first substantive Python project. Petsygram explored the Django web framework, looking at basic components such as setting up a user login/logout system, as well as more complex frameworks like a small REST API for 'like' and 'subscribe' accessed through jQuery/AJAX buttons. Deploying petsygram with the help of PythonAnywhere allowed me insight into the broader picture of web development. Up until this project I had mainly worked on small, individual scripts, but with petsygram, I tied together a python web framework and MySQL database (sqlite for testing), and even dug up my html/css front end knowledge from middle school to create a cohesive web app.

Built With

Author

petsygram's People

Contributors

peterzernia avatar

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.