풀스택(Full-Stack) 또는 소위 "자기중심 웹 개발자"가 되는 것에 대해 철저하고 진실된 토론을 해보자. 많은 초보들은 이것이 실제로 무엇을 의미하는지, 무엇이 관련되는지 알지 못한다.게다가 요즘에는 부트캠프를 제공하고 풀스택 프로그램을 판매하는 수많은 온라인 강좌가 있습니다.
프론트엔드, 백엔드, 풀스택 웹 개발에 대한 몇 가지 오해부터 시작해 보겠습니다. 이어서풀스택 개발자가 되는 것을 목표로 삼아서는 안 되는 이유에 대해 알아보겠습니다.
팔로우 비용은 전혀 들지 않습니다!
프론트엔드 개발이란 무엇입니까?
간단히 말해서프런트엔드는 웹 사이트, 웹 앱, 기본 모바일 앱 및 하이브리드 애플리케이션을 위한 UI 또는 사용자 인터페이스입니다.프런트엔드 개발자가 되려면HTML, CSS 및 JavaScript에 대한 통찰력이 필요합니다. 여기서 HTML은 웹페이지의 기본 또는 추정 마크업 언어이고, 스타일을 추가하기 위한 CSS, 추가 기능을 추가하기 위한 기본 프로그래밍 언어(JavaScript)입니다. 웹페이지를 활성화하는 것입니다.
프로젝트의 복잡성에 따라 프런트엔드는애플리케이션의 다양한 부분을 처리하기 위해다양한 타사 프런트엔드 라이브러리 및 프레임워크와 통합될 예정입니다 .거기에는 수많은 것들이 있습니다.그 중 일부를 언급하자면 React, Angular, NextJS, Lodash, Anxios 등이 있으며 그 목록은 계속됩니다.
따라서 프런트엔드는 백엔드와 통신하고 HTTP 요청과 웹 소켓을 통해 데이터를 수신합니다.
백엔드 개발이란 무엇입니까?
백엔드는 프런트엔드 UI로부터 데이터 업데이트를 수신한 후 데이터베이스를 업데이트합니다. 다르게 말하면백엔드는 UI에 표시할 데이터를 반환합니다.게다가백엔드 개발에는 웹 앱의 중요한 규칙이 있습니다. 즉, 프론트엔드 코드는 브라우저의 모든 사람이 액세스할 수 있으므로 항상 취약하고 항상 손상될 수 있는 것처럼 취급해야 합니다.백엔드 개발자는 데이터베이스가 손상되지 않도록 보호하기 위한 게이트 역할을 하는 특정 방법을 사용합니다.
백엔드 개발자는 다양한 프로그래밍 언어를 사용하며API는 일반적으로 마이크로서비스로 분할되어 하나는 Java, 다른 하나는 Scala, 다른 하나는 Node.js의 JavaScript 또는 기타 프로그래밍 언어로 작성될 수 있습니다.
풀스택 개발
이름에서 알 수 있듯이풀스택 개발자는 자체적으로 프런트엔드와 백엔드 작업을 모두 처리할 수 있습니다(두 번째 개발자를 모집할 필요 없음).백엔드 및 프론트엔드 개발에 대한 지식에도 불구하고 그들은 훨씬 더 많은 것을 알고 있습니다. 이는 코드를 묶고 애플리케이션을 배포하는 다양한 방법을 알고 있음을 의미합니다.
풀스택 개발 시장에 있는 많은 직업이 약간 오해를 불러일으킬 수 있다는점을 명심하세요. 이에 대해서는 잠시 후에 검토해 보겠습니다.그러나 실제로풀스택 작업은 예산이 부족한 소규모 회사에서 이루어지게 될 것입니다.이러한 회사는 각 사람에게서 최대한 많은 것을 얻기를 원합니다. 따라서 방금 언급한 작업을 수행하는 것 외에도 풀 스택 개발자는 인프라 관리와 같은 많은 DevOps를 수행할 것입니다. 대기업의 다른 사람이 처리하게 됩니다.
그렇다면 왜 풀스택 개발자가 되어서는 안 될까요?
이유 1.
대부분의 채용 정보 목록은 특정 팀의 특정 요구 사항과 실제로 일치하지 않는 광범위한 요구 사항을 제시합니다.예를 들어 Adobe에서 프론트엔드 개발자로 일하고 있는 친구에게 이에 관해 몇 가지 질문을 했더니, 그 친구도 프론트엔드 지원 당시 풀스택 개발자였다고 답했습니다.그리고 명확하게 설명하기 위해 그는 사실상풀 스택 개발자는 두 위치(프런트엔드와 백엔드) 모두에 지원할 수있지만 확보 후 직면하게 될 유일한 문제 또는 거부의 원인이 될 수도 있다고 덧붙였습니다.한 분야에 전문화되어 있지 않은데,그 자신에게도 그런 일이 일어났습니다.그는 프론트엔드에 전념하는 팀에서 프론트엔드 개발자로 일하고 있었습니다.
분석해 보면,필요한 분야에 전문 지식이 없다면 채용 제안을 받지 못할 가능성도 높습니다.그리고 이것은 모든 것(프런트엔드와 백엔드)을 단숨에 가르치는 60시간 이상의 비디오 콘텐츠로 부트 캠프를 수강하는 것의 단점 중하나일 수 있습니다.
내 블로그 독자만을 위한 독점!
웹 개발에 관한 최신 팁과 요령을 항상 찾고 계십니까?더 이상 보지 마세요!웹 개발 팁 과현재 인기가 높은 무료 도구 및 리소스에 대한 짧은 인기 기사를공유하는 주간 뉴스레터에 가입하세요.게다가 다른 곳에서는 볼 수 없는 독점 콘텐츠도 던져드릴게요!지금 구독하고 항상 한발 앞서가는 웹 개발자 커뮤니티에 참여하세요.
백엔드 개발자는 회사 데이터의 수호자이며 가장 귀중한 자산 중 하나입니다.많은 회사에서는데이터베이스를 엉망으로 만들기가 매우 쉽기 때문에 새로운 백엔드 개발자를 고용하는 것을 꺼릴 것입니다.엉망으로 만드는 것은 많은 비용이 들 수 있고 그들의 평판을 완전히 망칠 수 있기 때문에당신이 그 일을 할 만큼 자신감이 있다는 것을 그들에게 설득하기 어려울 것입니다. 그리고 당신은 Back을 포함하는 Full-Stack 개발자이기 때문입니다. -결국, 당신은 그런 고민을 많이 물려받게 될 거예요.
이유 3.
소프트웨어 개발의 일부 틈새 분야에서 탁월한 전문가는 일반적으로일반 전문가보다 더 많은 돈을 벌 수 있습니다. 왜냐하면 보수를 많이 받을 수 있는 회사는 특정 분야의 전문가를 원하기 때문입니다.
마지막 생각들
이제 돈이 전부는 아니며일부 개발자는 (나처럼) 풀 스택 개발자가 되는 것을 즐깁니다. 이는 아무런 문제가 없으며 풀 스택 개발자가 되는 것이 목표라면 그것은 경이로운 일입니다.계속해라.하지만 위에서 언급했듯이풀스택 개발자가 되기 위해서는 백엔드와 프론트엔드 모두의 전문가가 되기 위한 시간과 헌신이 필요합니다.
그래서 제가 제안하고 싶은 것은한 분야에 깊이 들어가 폭넓은 분야로 진출하라는것입니다 .프론트엔드 개발을 마스터하시면 계속해서 발전하실 것이라고 확신합니다.자신이 프론트엔드의 마스터라고 느끼고 기존의 많은 오픈 소스 프로젝트에 기여한 후에 는 프로젝트를 구축하고 프런트엔드 기술을 백엔드와 혼합하여천천히 그러나 확실하게백엔드에 들어갈 수 있습니다.백엔드에 뛰어들려고합니다.
turtle은 간단한 움직임을 반복하는 프로그램을 사용하여 복잡한 모양을 그릴 수 있습니다.
In Python, turtle graphics provides a representation of a physical “turtle” (a little robot with a pen) that draws on a sheet of paper on the floor.
It’s an effective and well-proven way for learners to encounter programming concepts and interaction with software, as it provides instant, visible feedback. It also provides convenient access to graphical output in general.
Turtle drawing was originally created as an educational tool, to be used by teachers in the classroom. For the programmer who needs to produce some graphical output it can be a way to do that without the overhead of introducing more complex or external libraries into their work.
Tutorial
New users should start here. In this tutorial we’ll explore some of the basics of turtle drawing.
Starting a turtle environment
In a Python shell, import all the objects of theturtlemodule:
from turtle import *
If you run into aNomodulenamed'_tkinter'error, you’ll have to install theTkinterfacepackageon your system.
Basic drawing
Send the turtle forward 100 steps:
forward(100)
You should see (most likely, in a new window on your display) a line drawn by the turtle, heading East. Change the direction of the turtle, so that it turns 120 degrees left (anti-clockwise):
left(120)
Let’s continue by drawing a triangle:
forward(100)
left(120)
forward(100)
Notice how the turtle, represented by an arrow, points in different directions as you steer it.
Experiment with those commands, and also withbackward()andright().
펜 제어
Try changing the color - for example,color('blue')- and width of the line - for example,width(3)- and then drawing again.
You can also move the turtle around without drawing, by lifting up the pen:up()before moving. To start drawing again, usedown().
The turtle’s position
Send your turtle back to its starting-point (useful if it has disappeared off-screen):
home()
The home position is at the center of the turtle’s screen. If you ever need to know them, get the turtle’s x-y co-ordinates with:
pos()
Home is at(0,0).
And after a while, it will probably help to clear the window so we can start anew:
clearscreen()
Making algorithmic patterns
Using loops, it’s possible to build up geometric patterns:
for steps in range(100):
for c in ('blue', 'red', 'green'):
color(c)
forward(steps)
right(30)
- which of course, are limited only by the imagination!
Let’s draw the star shape at the top of this page. We want red lines, filled in with yellow:
color('red')
fillcolor('yellow')
Just asup()anddown()determine whether lines will be drawn, filling can be turned on and off:
begin_fill()
Next we’ll create a loop:
while True:
forward(200)
left(170)
if abs(pos()) < 1:
break
abs(pos())<1is a good way to know when the turtle is back at its home position.
Finally, complete the filling:
end_fill()
(Note that filling only actually takes place when you give theend_fill()command.)
How to…
This section covers some typical turtle use-cases and approaches.
Get started as quickly as possible
One of the joys of turtle graphics is the immediate, visual feedback that’s available from simple commands - it’s an excellent way to introduce children to programming ideas, with a minimum of overhead (not just children, of course).
The turtle module makes this possible by exposing all its basic functionality as functions, available withfromturtleimport*. Theturtle graphics tutorialcovers this approach.
It’s worth noting that many of the turtle commands also have even more terse equivalents, such asfd()forforward(). These are especially useful when working with learners for whom typing is not a skill.
You’ll need to have theTkinterfacepackageinstalled on your system for turtle graphics to work. Be warned that this is not always straightforward, so check this in advance if you’re planning to use turtle graphics with a learner.
Deeplink in Flutter means the ability to open a specific page or perform a specific action within your app by clicking on a link from another app or a web page. It allows users to navigate to specific pages or sections of your app like cart, orders, or any product information, etc. Deeplink in Flutter is a very good feature for all developers and users. Flutter supports deep linking on iOS, Android, and web browsers. Implementing deep linking in Flutter apps enhances the user experience and makes it easier for users to navigate directly to specific sections.
Introduction
Deep linking is a crucial feature in mobile app development that enables smooth navigation to specific sections of different apps. This is very useful for users to access relevant content or perform specific tasks without manually navigating through the app’s screens. This deep linking feature eliminates the need for users to search for or manually locate the desired information within the app. Deep linking is a useful functionality for apps like e-commerce apps, content-driven apps, and social media platforms. By using deep links in Flutter, we can connect with other apps and services making it a good digital ecosystem.
Understanding Deep Links in Flutter
DeepLinks in Flutter means you have URLs or URIs to navigate or perform specific actions within a Flutter app. It directly helps users to access specific screens or content like webpages, screens, and notifications.
There are some concepts and terms that should be known to developers for using deep links in the Flutter applications.
URL Scheme-
A URL scheme is a unique identifier that identifies your app and allows it to handle specific deep links. It is generally a link to view or see a particular product in an e-commerce app.
Universal Links (iOS) and App Links (Android):
These are platform-specific mechanisms that help deep linking to work smoothly between web content and apps. These help in directly opening the content of the app, if the app is installed on the device, or fall back to the web page if the app is not present.
Deep Link Handling:
We need to handle the logic for deep lonks in Flutter like capturing the link URL and getting important data such as parameters or query strings. This captured information helps in navigating to a particular screen or performing the actions.
Implement Deep Linking on Android
To use deep links in your Flutter applications, we must have links for redirection that can be instantiated by adding intent filters for the incoming links.
In Android, we have two types of Uni Links, which are approximately the same as the meaning.
Open the DynamicLink section in firebase
On a domain that you may customize by adding your own name, company name, trademark, etc., dynamic links are generated. More relevant links that have been customized appear. After displaying this window, click Finish.
Now, on the newly opened page, select the “New Dynamic link” button.
Click on the new dynamic link button.
App Links-
App Links are the same as deep links, but it does require a specified host, i.e. a hosted file and along with this, the app links only tend to work with the HTTPS scheme.
You need to add the following code to your AndroidManifest file for adding deep links in Flutter. There you have to define an intent-filter and you can change the host with your need.
<!-- This is for App Links -->
<meta-data
android:name="flutter_deeplinking_enabled"
android:value="true" />
<intent-filter android:autoVerify="true">
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<!-- Accepts URIs that begin with https://YOUR_HOST -->
<data
android:scheme="http"
android:host="deeplink.example.com" />
<data android:scheme="https" />
</intent-filter>
Deep Links-
Deep links are the links in Android, which don’t require a specified host or any other custom scheme.
As discussed above, we have to paste for Deep links and we can change the host and scheme accordingly.
<!-- This is for Deep Links -->
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<!-- Accepts URIs that begin with YOUR_SCHEME://YOUR_HOST -->
<data android:scheme="blog" android:host="deeplink.example" />
</intent-filter>
We can use any of the intent filters in the AndroidManifest.xml file.
Theintent filteris a statement in the manifest file that specifies what intent or component will be received on the app side, according to native app implementation. When an action occurs, it can specify additional actions that should be taken on this intent filter.
Datais what the URI format, which primarily resolves to the activity, represents. Also, a data tag must have theandroidattribute.
Acategoryis mainly the type of intent-filter category. We have definedBROWSABLEin the category, which means that the intent filter can be accessed from the browser, and if not added, it will not be browsed.
Implement Deep Linking on iOS
In iOS also, we have two types of links-
Universal Links:
Universal links are those links that require a specified host or a custom scheme in their app. It works only with the HTTPS scheme. Below is the defined example of a universal link.
For setting up Universal Links we need to follow some steps-
Enable Associated Domains in your app’s entitlements.
Set up a unique URL identifier for your app.
Set up a JSON file on your website that contains information about your app’s URL identifier.
Enable Associated Domains
Creating the entitlements file in Xcode:
Open up Xcode by double-clicking on your ios/Runner.xcworkspace file.
Go to the Project navigator (Cmd+1) and select the Runner root item at the very top.
Select the Runner target and then the Signing & Capabilities tab.
Click the + Capability (plus) button to add a new capability.
Type “associated domains” and select the item.
Double-click the first item in the Domains list and change it from webcredentials.com to: applinks: + your host (ex: my-blogs.com). A file called Runner.entitlements will be created and added to the project.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<!-- ... other keys -->
<key>com.apple.developer.associated-domains</key>
<array>
<string>applinks:[YOUR_HOST_HERE]</string>
</array>
<!-- ... other keys -->
</dict>
</plist>
Custom URL:
In Custom URL, we don’t need a host or a custom scheme for our iOS app. An example of a custom URL is defined below. We need to add the host and scheme in the ios/Runner/Info.plist file.
There are two ways your app will receive a link — from a cold start and brought from the background.
ATTENTION-
getInitialLink/getInitialUri should be handled ONLY ONCE in your app’s lifetime, since it is not meant to change throughout your app’s life
Once we are done with the Universal Links set up for our app, we will need to handle the links within our Flutter app. To do this, we need to use theuni_linkspackage. Add this dependency in pubspec.yaml file and pub get it.
uni_links: ^0.5.1
Now, we just need to register a callback to handle incoming deep links.
import 'package:uni_links/uni_links.dart';
void main() {
// Initialize the deep link handler
initUniLinks();
runApp(MyApp());
}
void initUniLinks() async {
// Ensure that the app is ready to handle deep links
await getInitialUri();
// Set up a stream subscription to handle deep links when the app is running
uriSubscription = uriLinkStream.listen((Uri uri) {
// Handle the deep link here
handleDeepLink(uri);
});
}
void handleDeepLink(Uri uri) {
// Process the deep link URI and navigate accordingly
// You can extract parameters or perform specific actions based on the deep link data
}
Advanced Usage
Some additional features enhance the capabilities of deep linking in our Flutter app. These features help in creating more personalized and smooth user experiences, tracking user engagement, optimizing marketing efforts, and improving overall app performance.
Deep Link Analytics-
By implementing Deep Link Analytics, we can track and analyze user engagement with deep links. We can get the data on the number of clicks, conversions, and user behavior after accessing the app through a deep link. With this information, we can get to know about our deep links and can do some optimization if needed.
Deferred Deep Linking-
This helps in handling the scenarios, where the app is not installed on the user’s device on clicking the deep link. In these cases, the user is redirected to the app store to download the app and after installation, the app can open and handle the deep link that triggered the installation.
Dynamic Deep Links-
These help in generating deep links programmatically with dynamic parameters. It means we can generate deep links that include user-specific data, product IDs, or other variables.
Deep Link Attribution-
By using this you can track the source of each deep link and can know which channels are getting more engagement and conversions.
Deferred App Deep Linking-
Some platforms handle deep links when the app is already installed but not in the foreground. But this feature works even if the app is in the background or not currently running.
Example App
Let us understand this through a code. In the AndroidManifest.xml file, I have declared my link like — blog://deeplink.example
We will declare the function main.dart file like this.
We will open this app through the deeplink shown below. We will paste the same link(blog://deeplink.example) in the browser and it will show us the APP NAME of that app and will navigate us to the app by clicking on continue
Conclusion
Deep links help in seamless navigation to specific screens from external sources like the web, notifications, etc.
By using deep links, users are more engaged and satisfied. This also helps users to users to access relevant and personalized content.
Deep links provide cross-platform compatibility like for both iOS and Android.
Deep links can be customized with parameters or query strings, allowing for dynamic and personalized experiences based on user-specific data.
We can test and analyze deep links, also we can track user behavior, and optimize our app’s deep linking strategy.
By using deep links in Flutter, we can interact with other apps, services, or platforms. Also, we can collaborate and share the data.