Create your own instagram!
Technology stack
Before and after the end of the separation of development mode, the front-end and back-end projects belong to different projects
// instagram/client The front-end engineering
// instagram/service The backend engineering
Note: this project is purely personal fiddle, have nothing to do with them.
The login
Focus on
Posting
Thumb up, review and search
Modify personal information
Because of different port reason, front and back side to solve the cross domain. Launched devServer front-end engineering, need to start the backend engineering
Run the back-end projects
// goto service/config/config.local.ts,config your dabase information
config.sequelize = {
dialect: 'mysql',
host: '127.0.0.1',
port: 3306,
database: 'learn',
username: '',
password: '',
operatorsAliases: false
};
// goto /service/app/service/qiniu.ts,Configure your seven NiuYun token information
export default class qiniuService extends Service {
// To seven NiuYun individual panel=>The secret key management view
private accessKey: string = ''; // The secret key
private secretKey: string = ''; // The secret key
private publicBucketDomain = ''; // Outside the chain of the default domain name
private options: qiniuOptioin = {
scope: '', // upload scoped
expires: 7200
}
// ....
}
// Seven NiuYun storage area set, to go/client/src/components/upload/index.js,Configure the upload area
class Upload extends React.Component{
uploadFn = async () => {
// ...
var config = {
region: qiniu.region.z0 // Subordinate to the area, can go to seven NiuYun document view
};
// ...
}
Run the front-end project
If you have any help to you, you can order the upper right corner of the Star support thank you very much! ^_^