Skip to content
annypanny edited this page Nov 2, 2016 · 12 revisions

#Our project is web-based interconnected & friend-to-friend social networking application.

###We building our project by two part: front-end and back-end. The system is architectures on a REST Based Back-end using Django REST Framework. The front-end uses angularJS with HTML5, Bootstrap and CSS3.

#Front-end:

We used 3-tier architecture: Model, Controller, View.

The front-end is one-page website application.

The view is base on the index.html, angularjs use ng-view to get each subview when controller call it.

The bootstrap framework allow us to customize the website as our needs.

It has listed models: main, manageinfo, login, signup, myposts, managefriends

  • HomeController associate with main and manageinfo model, it calls Main interface and manageinfo interface.

  • LoginController associate with login model, it calls login interface.

  • RegisterController associate with signup model, it calls signup interface.

  • MyPostController associate with myposts model, it calls myposts interface.

  • MyFriendsController associate with managefriends model, it calls manageFriends interface.

  • FriendPostController associate with friendPost model, it calls friendpost interface.

The view and controller sending each other json files.

#Back-end:

The REST is build in the following way:

Models class in django have 4 models: Author, Post, Comment, Request

The Rest data is served using Django Rest Framework. This framework serves data based in the django urls files. It basically build a view that returns a json every time we request something to the following URL.

In Django Rest Framework, every view (URL) that we build, we need to build also the view, just as it is in Django. All the data is JSON FIle (For sending data and receiving also)

URLs that are served and their following view classes:

  • AuthorListView /socialnet/authors/ List all authors if you are admin

  • AuthorRetrieveView /socialnet/authors/[id]/ List a single author with the ID

  • AuthorCreateView /socialnet/authors/create/ create an author. No authentication needed.(POST)

  • PostByAuthorListView /socialnet/authors/[id]/posts/ List all authors posts that you can see from author with ID

  • FriendsAuthorView /socialnet/authors/[id]/friends/ List all friends of the author with id in

  • FriendRequestsAuthorView /socialnet/authors/friend_requests/ List all your friend requests

  • PostListView /socialnet/posts/ List all posts that you can see

  • PostRetrieveView /socialnet/posts/[id]/ List a post with the ID

  • PostCreateView /socialnet/posts/create/ Create a post with you as an author

  • PostUpdateView /socialnet/posts/[id]/update/ Update a post with the ID

  • PostDestroyView /socialnet/posts/[id]/destroy/ Delete a post with the ID

The chosen protocol for Authentication is the BasicAuthentication. It means that everytime we make a request, we need to send the authentication data. This data is a Base64 encryption of username and password.

For generating the output JSONs in Django Rest Framework we need to create serializers. The following serializers were used:

PostSerializer:

  • id

  • published_date

  • author

  • text

  • public

  • first_name

  • last_name

CreatePostSerializer:

  • id

  • published_date

  • text

  • public

FriendDataSerializer:

  • id

  • first_name

  • last_name

  • avatar

AuthorSerializer:

  • id

  • first_name

  • last_name

  • github

  • avatar

  • friends

  • email

FriendsAuthorSerializer:

  • friends with FriendDataSerializer

FriendRequestAuthorSerializer:

  • friend_requests with FriendDataSerializer

FullAuthorSerializer:

  • id

  • username

  • password

  • email

  • first_name

  • last_name

  • github

  • avatar

  • date_created

  • method: update

  • method: create

AuthenticateSerializer:

  • username

  • password

  • author


In part 1, you could check our project by:

front-end:

cd client/
python -m SimpleHTTPServer 3000 in terminal
localhost:3000

back-end:

cd mysite/
python manage.py runserver in terminal
127.0.0.1/8000/socialnet/post
127.0.0.1/8000/socialnet/authors

note: the front-end and back-end cannot use the same port number.

Clone this wiki locally