DevSpot
DevSpot
  • 41
  • 52 429

วีดีโอ

Web Developer Portfolio Contact Form (Vue.js, AWS, Postman)
มุมมอง 2.2K2 ปีที่แล้ว
In this video we go over how you can use AWS services to create a contact form on your portfolio. It will only take you 30 minutes to set it up and start receiving emails!
Scroll Based Animations In Under 10 minutes!
มุมมอง 942 ปีที่แล้ว
Here is a quick run down on how to use intersection observer in your JavaScript project. Links: Website: devspot.netlify.app/ TikTok: www.tiktok.com/@dev.spot Instagram: devspot.blog
Build a Basic Weather App w/ Vue [Learn how to use API's in your project!]
มุมมอง 2.3K2 ปีที่แล้ว
Build a Basic Weather App w/ Vue [Learn how to use API's in your project!]
Secure API Gateway with Cognito User Pool [AWS 2022]
มุมมอง 3302 ปีที่แล้ว
Secure API Gateway with Cognito User Pool [AWS 2022]
Vue Navigation Guards (AWS Amplify/Cognito User Auth)
มุมมอง 3.1K2 ปีที่แล้ว
Vue Navigation Guards (AWS Amplify/Cognito User Auth)
AWS API Gateway, Lambda and DynamoDB | Create a REST API [FREE] | An easy way to create a blog!
มุมมอง 6382 ปีที่แล้ว
AWS API Gateway, Lambda and DynamoDB | Create a REST API [FREE] | An easy way to create a blog!
How to build a portfolio website with Vue.js! [SUPER EASY]
มุมมอง 20K2 ปีที่แล้ว
How to build a portfolio website with Vue.js! [SUPER EASY]
The Basics of Props in Vue [QUICK and EASY]
มุมมอง 522 ปีที่แล้ว
The Basics of Props in Vue [QUICK and EASY]
Basics of JavaScript String Methods [MUST KNOW]
มุมมอง 502 ปีที่แล้ว
Basics of JavaScript String Methods [MUST KNOW]
EASY Multi-Page Web Application [JS,HTML,CSS]
มุมมอง 3.4K2 ปีที่แล้ว
EASY Multi-Page Web Application [JS,HTML,CSS]
Event Handling in Vue [EASY]
มุมมอง 1272 ปีที่แล้ว
Event Handling in Vue [EASY]
IMPROVE your Vue project with these rendering directives!!
มุมมอง 1142 ปีที่แล้ว
IMPROVE your Vue project with these rendering directives!!
Deploy Website to Netlify [Github+Netlify]
มุมมอง 1852 ปีที่แล้ว
Deploy Website to Netlify [Github Netlify]
How to use JSON Data in your Vue Project!
มุมมอง 8K3 ปีที่แล้ว
How to use JSON Data in your Vue Project!
JavaScript Array Methods (Mutating Arrays)
มุมมอง 1243 ปีที่แล้ว
JavaScript Array Methods (Mutating Arrays)
How to setup Vue Router
มุมมอง 2273 ปีที่แล้ว
How to setup Vue Router
Using Methods in Vue [2021]
มุมมอง 563 ปีที่แล้ว
Using Methods in Vue [2021]
How to get your first Vue project up and running [2021]
มุมมอง 1483 ปีที่แล้ว
How to get your first Vue project up and running [2021]

ความคิดเห็น

  • @sdharris10
    @sdharris10 หลายเดือนก่อน

    gotta stop scrolling up and down in idle periods.

  • @dvd.nicholas
    @dvd.nicholas 2 หลายเดือนก่อน

    Hello, thanks for the tutorial this really helps me with my project. I have this error in postman: "errorType": "Error", "errorMessage": "Cannot find package 'aws-sdk' imported from /var/task/index.mjs",

  • @JohnPennockDev
    @JohnPennockDev 3 หลายเดือนก่อน

    FWIW. ran into an issue with the codebuiid with an error something like "skipping invalid file path dist". I was using nuxt 3 and trying to deploy a static web site of my project. Needed to change the `build: commands:` to `npm run generate' instead of 'npm run build'

  • @DeVs51
    @DeVs51 3 หลายเดือนก่อน

    salut ca vas i'm from france et je voulais savoir comment et sur quel site tu vas pour telecharger les icons merci d avance merci

  • @billpliske
    @billpliske 3 หลายเดือนก่อน

    This video earned you a subscribe, despite the face that the Node script is somewhat different now, You got me most of the way there, thanks.

  • @michalfrankowski5328
    @michalfrankowski5328 6 หลายเดือนก่อน

    thanks for the vid, very helpful. I wonder how/where did you learn all of this? any course you can recommend for vue+aws applications? I am just starting out with Vue and want to use AWS for my infrastructure. I am a bit lost more I am reading about this.

  • @joanzaldivar9103
    @joanzaldivar9103 8 หลายเดือนก่อน

    Not sure if you'll respond but I have an issue where I cannot use require but I can use import but when testing it on AWS I keep getting errors on errors. but right now this is the error: "{ "errorType": "Error", "errorMessage": "Cannot find package 'aws-sdk' imported from /var/task/index.mjs",".

  • @devanshjain832
    @devanshjain832 9 หลายเดือนก่อน

    Thank you so much for this. Deployed my first CI-CD pipeline using your content.

  • @vicenteaviles8445
    @vicenteaviles8445 9 หลายเดือนก่อน

    where is the video with the animations an firebase?? thanks man

  • @pegienpatrick
    @pegienpatrick 10 หลายเดือนก่อน

    Very clear explanation

  • @mohammadkhattab2934
    @mohammadkhattab2934 10 หลายเดือนก่อน

    User I have a first json file named values_and_save and a second file named filedProperty. I want to add a new line in the first file. At the same time, the line added in the first file brings the name of Opekt to the second file using vue 3 and typescript and json server.

  • @psychochef8058
    @psychochef8058 11 หลายเดือนก่อน

    hello

  • @sainthokaha5630
    @sainthokaha5630 ปีที่แล้ว

    Can you please make a video of how you hosted this particular portfolio website online

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      Checkout my video on AWS codepipeline CICD. That video shows how you can host a site on s3. I am working on a video currently on how to use Amplify as well.

  • @tejaspatel7240
    @tejaspatel7240 ปีที่แล้ว

    I can't thank you enough for this tutorial, it was very useful. I searched for tutorials that would allow me to host my app directly on S3, but almost evry other tutorial video on youtube was suggesting to purchase domain. Yours was the only tutorial that perfectly suited my requirements, even though my project is in React, i only had to change the buildspec slightly, everything else was on spot. Again, thank you very much for this.

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      I'm glad I could help! Thank you for watching. 🙏

  • @tiffswan8785
    @tiffswan8785 ปีที่แล้ว

    Hi! Thank you so much for your video. Kindly ask your assistance on this. I'm still encountering a 502 Bad Gateway Internal Server Error, even after adding the EmailPolicy. Can you assist me with this? I hope you can respond.

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      Have you checked the cloud watch logs? That may help. Your response format for the lambda may also be incorrect. I have been wanting to make some more videos so I will work on a video going over this very soon.

    • @velialbeniz596
      @velialbeniz596 ปีที่แล้ว

      @@devspot3864 ty for your time. i am also getting that 502 Bad Gateway error. I also checked logs it returns some errors that i don't understand. 2023-11-19T23:36:58.279+03:00 INIT_START Runtime Version: nodejs:20.v13 Runtime Version ARN: arn:aws:lambda:eu-north-1::runtime:0593533e3a90a967b5685780855b7a89f7ba80b7d910603abf59369c6c4c7331 2023-11-19T23:36:58.350+03:00 2023-11-19T20:36:58.350Z undefined ERROR Uncaught Exception {"errorType":"Runtime.UserCodeSyntaxError","errorMessage":"SyntaxError: Unexpected token ';'","stack":["Runtime.UserCodeSyntaxError: SyntaxError: Unexpected token ';'"," at _loadUserApp (file:///var/runtime/index.mjs:1084:17)"," at async UserFunction.js.module.exports.load (file:///var/runtime/index.mjs:1119:21)"," at async start (file:///var/runtime/index.mjs:1282:23)"," at async file:///var/runtime/index.mjs:1288:1"]} 2023-11-19T23:36:58.371+03:00 INIT_REPORT Init Duration: 92.03 ms Phase: init Status: error Error Type: Runtime.ExitError ps: i 've checked after i post this message. i think i did several syntax error while i was writing the lambda function.

  • @vtkfsystem
    @vtkfsystem ปีที่แล้ว

    Would you mind sharing the repo for this tutorial? Thanks!

  • @UCcdTp7XpCkVLkaRCsDcifFg
    @UCcdTp7XpCkVLkaRCsDcifFg ปีที่แล้ว

    peace life

  • @Fikidiaz
    @Fikidiaz ปีที่แล้ว

    Great tech explanation! Disgusting the sounds you make with your mouth, sounds like you are trying to remove some meat from your teeth

  • @GovindaShah-bj6pd
    @GovindaShah-bj6pd ปีที่แล้ว

    Could you please upload code

  • @stratocaster1134
    @stratocaster1134 ปีที่แล้ว

    I followed it the the T but am getting an error message "{"message":"Missing Authentication Token"}"

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      This could be a couple of things! Make sure that the IAM role has the correct permissions. If that is not the issue then make sure you are passing the correct JWT from your cognito session if you are using that. Let me know if that helps.

    • @stratocaster1134
      @stratocaster1134 ปีที่แล้ว

      @@devspot3864 Thanks for the reply! The IAM role definitely has the right permissions. I don't think I am using a cognito session, how could I check this? I'm very new to all this backend stuff

    • @georgeritho3914
      @georgeritho3914 ปีที่แล้ว

      @@stratocaster1134 I did some research, since I received the same message. (FYI I'm also new to this backend developing) Found out postman needs to be authenticated to aws to invoke the API. Still wasn't successful with the '200 Ok' message response but I believe I resolved the "missing authentication token" and now receiving "internal server error". On the mission of resolving that now. Thanks @devspot3864 for the content. Looking forward for more! Also lmk if I didn't need to authenticate postman with AWS signature.

    • @georgeritho3914
      @georgeritho3914 ปีที่แล้ว

      Received a successful status: 200 Ok! Found out my "internal server error" was due to the lambda runtime I was using. I created a new lambda function and used Node.js 14.x instead of Node.js 18.x

  • @gnaneshnayak8790
    @gnaneshnayak8790 ปีที่แล้ว

    can please share the code?

  • @mateuszmazurek2185
    @mateuszmazurek2185 ปีที่แล้ว

    Thanks I see you posted the video about S3 pipeline! I managed to do this before watching this - but I will check that to see if this is any different :)

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      Oh nice! You'll have to let me know if you set it up differently or more efficiently.

  • @dimjohn5878
    @dimjohn5878 ปีที่แล้ว

    hello and thank u for this amazing video i am having this issue when i invoke my url {"message":"Missing Authentication Token"} what could be the case?

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      This could be a couple of things! Make sure that the IAM role has the correct permissions. If that is not the issue then make sure you are passing the correct JWT from your cognito session if you are using that. Let me know if that helps.

    • @dimjohn5878
      @dimjohn5878 ปีที่แล้ว

      @@devspot3864 Thank you for the quick response and the awesome content!

  • @Pss19940909
    @Pss19940909 ปีที่แล้ว

    Thanks a lot for this video!!! It's really clear and helpful for beginner :)))

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      I'm glad you found it helpful!

  • @dev-mantas
    @dev-mantas ปีที่แล้ว

    Good to see u back 😁

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      It has been a while! I have some more video ideas so there is more to come. Thanks for sticking around. 🙌

  • @mateuszmazurek2185
    @mateuszmazurek2185 ปีที่แล้ว

    Where can I get the JWT token to put in header from?

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      You should use the currentAuthenticatedUser method to get all info on the user. So import 'Auth' from 'aws-amplfiy' and then call Auth.currentAuthenticatedUser

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      docs.amplify.aws/lib/auth/manageusers/q/platform/js/#account-recovery-verification

  • @mateuszmazurek2185
    @mateuszmazurek2185 ปีที่แล้ว

    Thanks for those videos, could you make an video on how to actually deploy the webpage somwhere, not on localhost?

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      I am making a video on this right now actually. I'll show you how to make a CICD Piepline and host the site in an s3 bucket. Hopefully this weekend I'll get the video up.

    • @mateuszmazurek2185
      @mateuszmazurek2185 ปีที่แล้ว

      @@devspot3864 Thank You! Looking forward to that! I have followed all the previous tutorials, and now I only lack that JWT token to make everything work

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      Check my reply to your other question. I linked you some documentation that shows you what to do. You need to use Auth.currentAuthenticatedUser

    • @mateuszmazurek2185
      @mateuszmazurek2185 ปีที่แล้ว

      @@devspot3864 I solved it thanks! I tried to put my code here in comments for others, but I think youtube removes all my comments with code

  • @mateuszmazurek2185
    @mateuszmazurek2185 ปีที่แล้ว

    could you please specify package versions you use for amplify? I have a problem reproducing the code, to get it to work

    • @mateuszmazurek2185
      @mateuszmazurek2185 ปีที่แล้ว

      it works for me with older packages: "@aws-amplify/ui-components": "^1.7.2", "amplify": "^0.0.11",

  • @mateuszmazurek2185
    @mateuszmazurek2185 ปีที่แล้ว

    I am getting an error trying to access postProjects: "errorType": "Runtime.ImportModuleError", "errorMessage": "Error: Cannot find module 'aws-sdk' Require stack: - /var/task/index.js - /var/runtime/index.mjs",

    • @mateuszmazurek2185
      @mateuszmazurek2185 ปีที่แล้ว

      solved: nodejs 16 is by default now, need to revert to 14

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      You probably need to include the node modules folder. Let me know if that helps.

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      Disregard the reply then! I do believe you should be able to use nodejs 16 tho

    • @mateuszmazurek2185
      @mateuszmazurek2185 ปีที่แล้ว

      Can you see my questions? After I referesh my answers disappear here...

  • @chaimookie935
    @chaimookie935 ปีที่แล้ว

    Really really great instruction Blake! Hope you keep at it. Finding all of your tutorials extremely helpful in building out my portfolio.

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      I'm glad you found them to be helpful! I do have some video ideas in mind so hopefully you'll see those soon.

  • @thewhiteman67
    @thewhiteman67 ปีที่แล้ว

    i got a auth token failed. woudl have been cool to show how to create or find that.

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      If you are using Amplify just check the Current Authenticated User object. Within that object you should see all of the user data including Current auth token

    • @thewhiteman67
      @thewhiteman67 ปีที่แล้ว

      @@devspot3864 hmm dont know what amplify is. ill look it up really quick. my friend sent me some notes from this same project that he did about a week ago. with his notes i got this error in Postman. { "statusCode": 400, "body": "\"Unsupported route: \\\"undefined\\\"\"", "headers": { "Content-Type": "application/json" } } the code actually changed around a little bit from what you originally had. i'm not quit sure where im getting the error from.

  • @trisomik_gaming69
    @trisomik_gaming69 ปีที่แล้ว

    how about nested json data like arrays of object and you want specific data, should i go traditional map() or theres a vue function for it?

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      The v-for directive allows for use of indexes. That might help you get specific nested items.

  • @JackyG341
    @JackyG341 ปีที่แล้ว

    Other than that I found this one of the best tutorials I've used as it's short and concise, very straightforward. Thanks! It'd be great if you could link the code as you skip a few things here or there.

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      I'm glad you found it helpful. Future videos I will link some sample code. I've been building alot with some other AWS technologies so there are more videos on the way.

  • @tereziabodova13
    @tereziabodova13 ปีที่แล้ว

    Hello, can i ask u please, which extensions exactly are u using? i did everything according this tutorial, but this code is all red underlined in my VScode.... and i have almost every vue extension downloaded :D

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      Hmm that's interesting. Did you properly install all the correct dependencies? If the code is all underlined I am wondering if you have vue installed properly.

    • @devspot3864
      @devspot3864 ปีที่แล้ว

      Can you paste the dependencies that are in your package.json?

  • @Gdcrow293
    @Gdcrow293 2 ปีที่แล้ว

  • @Gdcrow293
    @Gdcrow293 2 ปีที่แล้ว

    What about images???

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      You could use base64 encoded images!

  • @zewilliamjusttodev5286
    @zewilliamjusttodev5286 2 ปีที่แล้ว

    code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: my-project@2.0.251 npm ERR! Found: aws-amplify@5.0.5 npm ERR! node_modules/aws-amplify npm ERR! aws-amplify@"^5.0.5" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer aws-amplify@"3.x.x || 4.x.x" from @aws-amplify/ui-components@1.9.40 npm ERR! node_modules/@aws-amplify/ui-components npm ERR! @aws-amplify/ui-components@"*" from the root project

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      Is your package.json in the correct location?

    • @mateuszmazurek2185
      @mateuszmazurek2185 ปีที่แล้ว

      I had the same error, solution was to install older packages. For me it worked with "@aws-amplify/ui-components": "^1.7.2", "amplify": "^0.0.11",

  • @mr.gegenpress7750
    @mr.gegenpress7750 2 ปีที่แล้ว

    I'm very new to AWS and also needed to hook a server up for my portfolio form so this video came in handy. Thanks a lot and keep up the great work!!

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      I'm glad you found it helpful!!

  • @mohamedhaisam7075
    @mohamedhaisam7075 2 ปีที่แล้ว

    Bro Put Videos about React js

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      I could do that! Thanks for the suggestion.

  • @florian8019
    @florian8019 2 ปีที่แล้ว

    great how can i get jwt?

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      If you set up aws amplify the jwt should be in your user data! Let me know if that helps or not. I believe I made a video on this. I will check. If not I will make a video on it this week.

    • @florian8019
      @florian8019 2 ปีที่แล้ว

      @@devspot3864 thanks

  • @MinerMovie
    @MinerMovie 2 ปีที่แล้ว

    Can you include the name of the VS code extension you used for auto complete?

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      Sorry for the delay! I've been off socials for a month. I use Intellicode as well as HTML CSS Support for setting up html and css faster. Hopefully that helps!

  • @dev-mantas
    @dev-mantas 2 ปีที่แล้ว

    When I started I was using this but then I found gsap lib it makes stuff like this way easier with plugins like scrollTrigger it also allows for timelines. Another like from me tho

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      I'll have to check that out!! Thanks for commenting!! 🤙👍

  • @BlakePhilipPreston
    @BlakePhilipPreston 2 ปีที่แล้ว

    Great!

  • @devspot3864
    @devspot3864 2 ปีที่แล้ว

    Do you have any other topics you want to see covered?

  • @dr0zieej262
    @dr0zieej262 2 ปีที่แล้ว

    DJ Khalid couldn't of said it better him self 🔑 keep up the good work

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      You right haha Major key 🔑

  • @lb1823
    @lb1823 2 ปีที่แล้ว

    Crear video, I have a problem with the image Path not working I think for a Base VueJs path for storing images

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      Were you able to figure out your issue?

    • @lb1823
      @lb1823 2 ปีที่แล้ว

      @@devspot3864 Yep

  • @balazsKelemenUK
    @balazsKelemenUK 2 ปีที่แล้ว

    great tutorial, do you happen to have the repo? I would need those png files , please

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      Thank you!! And that's a great idea I should set a repo up. I will do that this evening and send the link to you here. 👍🤙

  • @FaBInh045
    @FaBInh045 2 ปีที่แล้ว

    Thanks for that video, very helpful! I would like to know, is that possible to create an input text to change the city? Maybe I have to convert the city to latitude and longitude with an API and then change the data in the code you provided.

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      I'm glad you found it helpful!! I believe OpenWeather API (the api in the video) only gets data based on lat and long. So yes you would need to use another API to get the lat and long based on the city. I know AWS Location has a feature that could do this for you. I recommend checking that out. I might put together a video on how to set that up 👌👌

  • @Jannarys
    @Jannarys 2 ปีที่แล้ว

    Really helpful thanks

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      Glad it helped!!

  • @Weagle1337
    @Weagle1337 2 ปีที่แล้ว

    Hii, good video!, can I get the token data in the lambda?

    • @devspot3864
      @devspot3864 2 ปีที่แล้ว

      Thank you! And yes you can. You can either configure the lambda to handle the token data directly or you could send token data in the header or body of the request. I guess it depends on the security you are looking for. I could put together a video on how to go about doing that 🤙🤙