I’m working on a project where teachers create assignments and pick folders in their Google Drive for student submissions. Students then need to upload their work directly to these teacher-selected folders. I’m using React with Google Picker for folder selection on the frontend and NestJS on the backend.
My main questions are:
- What folder info should I send from React to NestJS after a teacher picks a folder?
- How can I set up the student file upload process to save files in the right teacher folder?
I’ve got Google Picker working in React, but I’m unsure about the next steps. Any tips on handling the data flow between React, NestJS, and Google Drive would be super helpful. Also, if anyone has experience with similar setups, I’d love to hear about it.
Thanks in advance for any advice!
I’ve tackled a similar project before, and here’s what worked for me:
For the folder info, you really just need the folder ID from Google Picker. That’s the key piece that lets you target the right location in Drive.
On the NestJS side, I’d suggest creating a dedicated service for handling Google Drive operations. This keeps your code organized and reusable. In this service, implement methods for both retrieving folder details and uploading files.
For student uploads, you’ll want to set up a route in NestJS that accepts both the file and the folder ID. Use the Google Drive API’s files.create method to handle the actual upload. Make sure you’re properly authenticating with OAuth2 - that can be a bit tricky at first.
One thing to watch out for: permissions. You’ll need to ensure that your app has the right scopes to write to folders owned by different users. Also, consider implementing some kind of rate limiting to prevent abuse of the upload feature.
Good luck with your project! It sounds like a great tool for teachers and students.
hey luke, i’ve done smthin similar. for folder info, just send the folder ID to nestjs. it’s enuf for google drive API.
for student uploads, use google drive API in nestjs. create a service that takes folder ID + file, then uses drive.files.create to upload.
hope this helps! lmk if u need more details
For the folder information, you should indeed send the folder ID from React to NestJS. This is sufficient for interacting with the Google Drive API.
Regarding student file uploads, implement a file upload endpoint in your NestJS backend. This endpoint should accept the file and the folder ID as parameters. Use the Google Drive API’s files.create method to upload the file directly to the specified folder.
You’ll need to set up OAuth2 authentication in your NestJS backend to interact with Google Drive. Store the necessary credentials securely.
Consider implementing error handling and retry mechanisms for more robust file uploads. Also, think about how you’ll manage permissions to ensure students can only upload to their assigned folders.
Lastly, consider implementing progress tracking for large file uploads to enhance the user experience.