Đồ án mạng xã hội hẹn hò honeyaa

Từ đó nhóm chúng em quyết định lựachọn đề tài “mạng xã hội hẹn hò” với mục đích tạo ra một nơi giao lưucũng như kết bạn cho những người cô đơn hoặc đơn giản hơn là giảm thờigian giữa các

LỜI CẢM ƠNLời cảm ơn này nhóm chúng em xin gửi tới thầy Nguyễn Công Hoan,người đã tận tình hướng dẫn nhóm chúng em trong khoảng thời gian thực hiện

đồ án Những gợi ý và định hướng của thầy chính là nền móng vững chắc đểchúng em có thể thực hiện đề tài này một cách hoàn thiện nhất, những lời nhậnxét của thầy là những góp ý tổng quan nhất để cải thiện phần mềm cho nhómchúng em Nhóm chúng em xin chân thành cảm ơn thầy

Các kiến thức cần thiết cũng như việc thực hiện đề tài đã được thực hànhtrong 3 tháng, với một khoảng thời gian ngắn ngủi như vậy việc có những thiếusót và các hạn chế là điều khó tránh khỏi Vì vậy nhóm rất mong để có thể nhậnđược sự chỉ bảo của thầy cũng như các đóng góp của các bạn để có cơ hội hoànthiện ứng dụng nhiều hơn

Mục Lục:

5.2 Tại sao lại chọn Ngrok 18

2.3.2 Tính năng xem những người đã like mình 32

I Giới thiệu chung

1 Sơ lược các thành viên trong nhóm

Nhóm gồm 2 thành viên:

- Thành viên 1 : Đặng Ngọc Duy

MSSV : 18520655Lớp : PMCL2018.1Email : 18520655@gm.uit.edu.vn

2.1 Giới thiệu đề tài

Phần mềm dần như là một mảng không thể thiếu trong cuộc sống hiện tại,

nó hỗ trợ rất nhiều khía cạnh từ các phần mềm cho việc kiểm toán, quản

lý cho đến các phần mềm như là mạng xã hội để giao tiếp và xã giao Vàmột trong những mảng mới nhất gần đây mà các phần mềm mới phát triểnhướng tới là mảng giao tiếp, hẹn hò Các ứng dụng mảng này hướng tớiviệc số hóa việc làm quen một người và đẩy nhanh các quá trình tìm hiểumột người

Việc hẹn hò hay tìm hiểu một người mới luôn bao gồm các giaiđoạn diễn ra tuần tự như sau: Bắt chuyện một người, giai đoạn tìm hiểu vàcuối cùng sẽ dẫn tới giai đoạn hẹn hò

Việc ra đời của các mạng xã hội hẹn giúp thúc đẩy các quá trìnhnày nhanh lên và dễ tiếp cận hơn và đặc biệt là tạo ra một cách dễ hơn để

có thể tìm hiểu sâu về một người Từ đó nhóm chúng em quyết định lựachọn đề tài “mạng xã hội hẹn hò” với mục đích tạo ra một nơi giao lưucũng như kết bạn cho những người cô đơn hoặc đơn giản hơn là giảm thờigian giữa các quá trình làm quen một người bạn mới.

2.2 Khảo sát hiện trạng

Hiện tại có các ứng dụng mạng xã hội và các mạng xã hội hẹn hòkhác như có thể kể đến như là Facebook, Tinder, Badoo, Blued, Ymeetmehầu hết các mạng xã hội này đều hướng tới việc kết bạn và làm quen mộtngười mình chưa biết và bắt đầu bắt chuyện làm quen

Trải nghiệm sử dụng phần mềm Tinder chúng em có rút ra các quytrình như sau:

- Phần mềm bắt chúng ta phải like một người rồi phải chờ người đólike lại mình

- Phần mềm có giao diện dễ dùng dễ hiểu

- Quá trình tìm hiểu bắt buộc phải thông qua chat

Đúc kết từ các ý tưởng và các hạn chế trên nhóm em đề xuất mộtứng dụng mạng xã hội hẹn hò, tập trung vào việc ghép đôi nhanh Và cótương tác với các kênh chat

2.3 Nội dung nghiên cứu

Nhóm chúng em xin đề xuất về các công nghệ cũng như đối tượngtìm hiểu trong ứng dụng như sau:

● Đối tượng đề tài hướng đến:

○ Nam, nữ đang có nhu cầu kết bạn và mở rộng các mối quanhệ

2.4 Kết quả hướng tới

Đề tài ứng dụng hẹn hò là một phần mềm có thể sử dụng trên di động vàđáp ứng các yêu cầu:

- Kết bạn thông qua một mạng xã hội

- Có các bài đăng hoặc nơi lưu trữ các thông tin người dùng

- Có update trạng thái người dùng

- Hỗ trợ chọn bạn để hẹn hò một cách nhanh nhất

- Thúc đẩy quá trình làm quen truyền thống thay vào đó là sử dụngtrên một phần mềm di động

Và các mục tiêu của sinh viên là:

● Tìm hiểu được các framework mới

● Tìm hiểu về quá trình chọn bạn để hẹn hò

● Xây dựng được phần mềm hẹn hò có thể sử dụng được trên điệnthoại di động

II Cơ sở lý thuyết

1 Tổng quan về Flutter và Dart

1.1 Khái niệm

Flutter được Google giới thiệu là một người mới trong thế giới ứngdụng di động Là một SDK mới của Google dành cho các thiết bị di độnggiúp developers và designers xây dựng nhanh chóng ứng dụng dành chocác thiết bị di động (Android, iOS) Flutter là dự án mã nguồn mở đangtrong giai đoạn thử nghiệm Flutter bao gồm Reactive framework và côngnghệ hiển thị 2D (2D rendering engine)và các công cụ phát triển

(development tool) Các thành phần này làm việc cùng nhau giúp ta thiết

kế, xây dựng, test, debug ứng dụng

1.2 Tại sao lại chọn Flutter và dart

Các nhà phát triển tại Google và các nơi khác sử dụng Dart để tạocác ứng dụng chất lượng cao, quan trọng cho iOS, Android và web Vớicác tính năng nhắm đến sự phát triển phía khách hàng, Dart rất phù hợp

cho cả ứng dụng di động và web Dart giúp bạn tạo ra những trải nghiệmđẹp, chất lượng cao trên tất cả các màn hình, với:

● Một ngôn ngữ được tối ưu hóa cho client

● Framework mạnh mẽ

● Công cụ linh hoạt

1.3 Kiến trúc Flutter

Flutter được thiết kế như một hệ thống nhiều lớp, có thể mở rộng

Nó tồn tại dưới dạng một loạt các thư viện độc lập mà mỗi thư viện phụthuộc vào lớp bên dưới Không có lớp nào có quyền truy cập đặc quyềnvào lớp bên dưới và mọi phần của mức khung được thiết kế để trở thànhtùy chọn và có thể thay thế

❖Embedder Platform-specific:

Đối với hệ điều hành cơ bản, các ứng dụng Flutter được đóng gói

giống như bất kỳ ứng dụng gốc nào khác Embedder Platform-specific

cung cấp một điểm nhập; phối hợp với hệ điều hành cơ bản để truy cậpvào các dịch vụ như hiển thị bề mặt, khả năng truy cập và đầu vào; vàquản lý vòng lặp sự kiện tin nhắn Trình nhúng được viết bằng ngôn ngữphù hợp với nền tảng: hiện tại là Java và C ++ cho Android, Objective-C /Objective-C ++ cho iOS và macOS, và C ++ cho Windows và Linux Sửdụng công cụ nhúng, mã Flutter có thể được tích hợp vào ứng dụng hiện

có dưới dạng mô-đun hoặc mã có thể là toàn bộ nội dung của ứng dụng.Flutter bao gồm một số trình nhúng cho các nền tảng mục tiêu chung

❖Flutter Engine:

Cốt lõi của Flutter là Flutter Engine , phần lớn được viết bằng C ++ và

hỗ trợ các nguyên tắc cần thiết để hỗ trợ tất cả các ứng dụng Flutter Động

cơ chịu trách nhiệm sắp xếp các cảnh tổng hợp bất cứ khi nào cần sơn mộtkhung mới Nó cung cấp triển khai cấp thấp của API cốt lõi của Flutter,bao gồm đồ họa, bố cục văn bản, tệp và mạng I / O, hỗ trợ trợ năng, kiến trúc plugin và chuỗi công cụ biên dịch và thời gian chạy Dart

❖Flutter Framework:

Flutter Framework , cung cấp một framework hiện đại được viết

bằng ngôn ngữ Dart Nó bao gồm một bộ thư viện nền tảng, bố cục và nềntảng phong phú, bao gồm một loạt các lớp Làm việc từ dưới lên trên,gồm:

● Foundation classes và các dịch vụ khối xây dựng như

animation, painting, and gestures cung cấp các nội dung

trừu tượng thường được sử dụng trên nền tảng cơ bản

● Rendering layer cung cấp một sự trừu tượng để xử lý bố

cục Với lớp này, bạn có thể xây dựng một cây các đối tượng

có thể kết xuất Bạn có thể thao tác động các đối tượng này,với cây tự động cập nhật bố cục để phản ánh các thay đổi củabạn

● Widgets layer là một phần trừu tượng hóa thành phần Mỗi

đối tượng kết xuất trong lớp kết xuất có một lớp tương ứngtrong lớp vật dụng Ngoài ra, lớp vật dụng cho phép bạn xácđịnh tổ hợp các lớp mà bạn có thể sử dụng lại Đây là lớp màtại đó mô hình lập trình phản ứng được giới thiệu

● Các thư viện Material và Cupertino cung cấp các bộ điều

khiển toàn diện sử dụng các thành phần native của lớp widget

để triển khai ngôn ngữ thiết kế Material hoặc iOS

1.4 Một số khái niệm cơ bản của Flutter

1.4.1 Stateful WidgetStatefulWidget là một widget động và nó có thể thay đổi những gì nóđang hiển thị bằng cách thay đổi state của chính nó

Để có thể tạo một stateful widget cần phải kế thừa lớp statefulWidgetbằng cú pháp

Class main extends StatefulWidget

Và để một state cần có thể render được thì phải override các phương thứcbuild của state đó với cú pháp

@override

Widget build(buildcontext context)

Và cuối cùng để có thể đổi state của widget thì sẽ cập nhật thông quaphương thức setState() của widget

Các chức năng nên sử dụng stateful Widget là

1.4.2 Stateless WidgetStatelessWidget là một loại widget tĩnh và không thể tự thay đổi đượcnhững gì mà nó hiển thị sau khi render.

Để có thể tạo ra một StatelessWidget cần phải kế thừa từ lớp

StateLesswidget của flutter và cần phải override lại một lớp build để cóthể render được widget

Class main extends Statelesswidget

@override

Widget build (buildcontext context)

Stateless widget không thể tự thay đổi được chính nó nhưng nếu widgetcha thay đổi thì statelesswidget sẽ được khởi tạo lại

Các trường hợp nên sử dụng StateLessWidget:

2 Tổng quan về Django RESTful Framework

2.1 Khái niệm

Trong bối cảnh phát triển web, chúng ta thường nói về RESTful API Đây

là một cách phổ biến để cung cấp ứng dụng cho bên thứ ba ( các ứng dụng

và web ) Điều này chỉ cần cung cấp thông tin lưu trữ trong cơ sở dữ liệu

ở định dạng phổ biến như XML hoặc JSON, bằng cách này một ứng dụngbên thứ ba có thể tương tác với dữ liệu mà không cần kết nối trực tiếp với

cơ sở dữ liệu , cũng vì thế không quan trọng cơ sở dữ liệu là MySQL hayPostgreSQL, hoặc nếu ứng dụng được viết bằng Java hoặc Python, nhưngRESTful APIs có thể được sử dụng để sửa chữa cơ sở dữ liệu

Django REST framework là một công cụ hỗ trợ đắc lực trong việc xâydựng Web API Một số lý do khi ta nên sử dụng REST:

● Có hỗ trợ dữ liệu ORM và non-ORM với Serialization

● Tài liệu phong phú, cộng đồng hỗ trợ lớn

● Được sử dụng trong các công ty quốc tế như Mozilla, Red Hat,heroku

2.2 Tại sao lại chọn Django

Django cho phép giải quyết một số lượng lớn các nhiệm vụ rất nhanhchóng và dễ dàng Nó làm cho việc phát triển phần mềm bằng Python trởnên dễ dàng và đơn giản

ORM có nhược điểm nhưng Framework Django REST biến nhược điểmcủa nó thành lợi thế vì giao diện mà Django ORM cung cấp là tốt nhấtcho REST

Ưu điểm rất lớn của Framework Django REST là nó có các mô hình giaothoa hoàn hảo nhưng nó cũng có thể hoạt động với việc triển khai cácData Mapper Pattern

2.3 Kiến trúc của Django

● HTTP requests sẽ được đối sánh bởi URL Patterns và được

chuyển đến View

● View xử lý các HTTP requests và trả về HTTP response (với sự

trợ giúp của Serializer )

● Serializer tuần tự hóa / giải mã hóa các đối tượng mô hình dữ liệu

● Models chứa các trường và hành vi cần thiết cho hoạt động CRUD

Cách tạo một bảng trong Django

from django.db import models

class Person(models.Model):

first_name = models.CharField(max_length=30) last_name = models.CharField(max_length=30)

Câu code ở trên tương đương với lệnh query sau

CREATE TABLE myapp_person (

"id" serial NOT NULL PRIMARY KEY,

"first_name" varchar(30) NOT NULL,

"last_name" varchar(30) NOT NULL

);

Khái niệm Backend nhắc tới trong câu trên để chỉ việc xử lý và lưu trữ dữliệu trong service, ở vùng "phía sau" mà người dùng không nhìn thấy.Firebase là một trong những BaaS (Backend as a service).

Serverless architecture được chú ý như một giải pháp đáp ứng yêu cầurelease một dịch vụ trong thời gian ngắn, trong bối cảnh đó, BaaS ra mắtngười dùng

BaaS hướng đến thiết bị chủ yếu là mobile nên còn được gọi với một têngọi khác là MBaaS

3.2 Tại sao lại chọn Firebase

● Xây dựng ứng dụng nhanh chóng mà không tốn thời gian

● Uy tín chất lượng đảm bảo từ Google: Firebase được google hỗ trợ

và cung cấp trên nền tảng phần cứng với quy mô rộng khắp thếgiới, được các tập đoàn lớn và các ứng dụng với triệu lượt sử dụng

● Firebase Cloud Storage

● Firebase Remote Config

● Firebase Test Lab

● Firebase Crashlytics

● Firebase App Indexing

● Firebase Dynamic Links

bị di động và web, bao gồm các nền tảng quản lý nội dung như WordPress

và Shopify Trong tài liệu của chúng tôi, bạn có thể khám phá các tàinguyên và đào tạo để triển khai SDK của OneSignal, tìm hiểu cách tậndụng API mạnh mẽ của OneSignal và tìm các phương pháp hay nhất đểgửi tin nhắn nhằm tăng mức độ tương tác của người dùng

4.2 Tại sao lại chọn Onesignal

● Không giới hạn thiết bị, không giới hạn tin nhắn, thống kê ngay lậptức, có support api

● Có user segment

● Có A/B test message

● Thống kê nhận và click

4.3 Kiến trúc của Onesignal

5 Tổng quan về Ngrok

5.1 Khái niệm

Ngrok là công cụ tạo đường hầm (tunnel) giữa localhost của bạn vàinternet Giúp người khác mạng có thể truy cập được localhost của bạnthông qua custom domain của ngrok

Ví dụ: mydomain.ngrok.io => localhost:80

5.2 Tại sao lại chọn Ngrok

● Chạy demo dự án từ chính máy mà không cần deploy lên server

● Test responsive trên mobile một cách dễ dàng thông qua URL màngrok cung cấp

● Xây dựng webhook tới localhost một cách dễ dàng

● Hỗ trợ http, https, tcp

● Hỗ trợ IP whitelist

5.3 Kiến trúc của Ngrok

III Phân tích thiết kế hệ thống

1 Giới thiệu ứng dụng

1.1 Bài toán thực tế

Trong nền kinh tế đang phát triển con người đang dần phải làm việc nhiềuhơn và giao tiếp ít hơn, các giao tiếp hiện tại đều đã được số hóa các mạng xãhội đã được phát triển để giúp các tương tác này trở nên đơn giản hơn Việc làmquen một người hay hẹn hò một người cũng bị ảnh hưởng rất nhiều vì vậy việc

số hóa giai đoạn này để có thể giúp mọi người làm quen với nhau qua các thiết

bị điện tử hiện nay cũng là điều thiết yếu

1.2 Hướng giải quyết

Nhóm đề xuất xây dựng một ứng dụng mạng xã hội hẹn hò để có thể hỗtrợ cũng như thúc đẩy quá trình làm quen một người mới này Mạng xã hội này

tập trung chủ yếu về quá trình kết bạn và hơn nữa là hẹn hò Mạng xã hội phải

có các tính năng tương tác cơ bản như like và chat cung cấp các phương thức đểgiao tiếp với nhau

1.3 Tổng quan ứng dụng

1.3.1 Sơ đồ1.3.1.1 Sơ đồ Use case hệ thống

1.3.1.2 Đặc tả Use Case

Mã use case UC01

Tên use case Swipe

Tác nhân Người dùng

Mô tả Cho phép người dùng chọn người mình thích

Điều kiện tiên

3 Kéo sang

trái, phải

vào cơ sở dữ liệu của hệ thốngLuồng thay thế

Điều kiện sau Mình đã like một người

Điều kiện thoát

Mã use case UC02

Tên use case List all user

Tác nhân Người dùng

Mô tả Hiển thị tất cả những người đã thích mình

Điều kiện tiên

quyết

Người dùng phải đăng nhập vào ứng dụng

Luồng sự kiện STT Tác nhân Hệ thống phản hồi

hình hiệnngười likemình

số lượng người like

3 Hệ thống gửi về list các người

đã like mình và hiện lên mànhình hệ thống

thành công thì sẽ báo có lỗi vàkhông hiển thị

Điều kiện sau Hiện được list các người dùng đã thích mình

Điều kiện thoát Người dùng chuyển sang tab khác,

Người dùng ấn nút thoát

Mã use case UC03

Tên use case Chat

Người dùng đã phải đăng nhập

Cả 2 người đã like lẫn nhauLuồng sự kiện STT Tác nhân Hệ thống phản hồi

1 Truy cập vào

trang tròchuyện

tin

3 Nhập thông

tin gửi

lên server kiểm tra Nếu hợp lệ

sẽ gửi cho người tới

hình thông báo gửi khôngthành công

Điều kiện sau Người dùng gửi được thông tin

Điều kiện thoát Người dùng chọn thoát phòng trò chuyện

Mã use case UC04

Tên use case Match

Tác nhân Người dùng

Mô tả Hai người dùng sau khi nhau sẽ tương hợp và có thể

trò chuyện với nhauĐiều kiện tiên

quyết

Người dùng đã đăng nhậpHai người đã thích lẫn nhauLuồng sự kiện STT Tác nhân Hệ thống phản hồi

1 Gửi like tới

người kia

kiểm tra xem là người kia cólike người dùng chưa

dùng rồi sẽ hiện lên matchLuồng thay thế

Điều kiện sau Người dùng sẽ hiện trong danh sách chat

Điều kiện thoát Người dùng chuyển tab

Người dùng ấn nút thoát

1.3.1.3 Lưu đồ xử lý việc matching

1.3.1.4 Lưu đồ xử lý việc nhắn tin

1.3.1.5 Lưu đồ thể hiện show màn hình like screen

1.3.1.6 Sơ đồ tuần tự chức năng chat

1.3.1.7 Sơ đồ tuần tự chức năng xem người like mình

1.3.1.8 Sơ đồ tuần tự chức năng Matching

1.3.2 Mô hình dữ liệu quan hệ

Server được xây dựng trên kiến trúc MVC, nhận request ở các view

và chỉ định tới các model và controller tương ứng

Client sử dụng kiến trúc Bloc để có thể request api nhận dữ liệu vàupdate các state của widget

Client sử dụng OneSignal và firebase để có thể notification vàauthentication trên ứng dụng

Cloud firestore sẽ hỗ trợ lưu các đoạn chat và các hình ảnh củangười dùng

2 Product Requirement Document

2.1 Objective